关于jqGrid框架的 数据表格的展示

总结下工作项目中遇到的问题,解决。

 

问题: jgrid 加载 本地数据(不是数据库传查询过来的数据),本地数据信息之类的,展示到前台。

 解决

    自定义列名,然后 根据jqgrid 的$("#transferList").jqGrid("addRowData", 1+i, dataResult1, "last");方法,对数据表格的更新

这里只附上了 前台JavaScript 的代码。

    	var dataResult1 = {};		
                jQuery("#transferList").jqGrid('setGridParam', {}).clearGridData();//清空数据
    			 $.post(g_baseURL + '/sx/*****/***List',{ checkItems:$("#checkItems").val(),showInfo:$("#showInfo").val()}, function(data) {
    					 for(var i=0;i<data.length;i++){
    							var result=data[i]
    							dataResult1.address = result.address;
    							dataResult1.repository = result .repository;
    							$("#transferList").jqGrid("addRowData", 1+i, dataResult1, "last");// 更新数据
    						}
    				 
    			 })

接下来看看数据表格的展示设置

var validationListGird = $("#transferList").jqGrid({
        	 caption :'<div style=" width:100%;">'+
             '<input class="gridExport goSearch" type="button" value="按钮" style=" margin-right:5px;float:left;"/></div>',
            datatype: "local",
            mtype: 'post',
            height: '100%',
            width:'100%',
           colNames:['ID','地区','仓库名称'], 
           prmNames: {page:"pageNo",rows:"pageSize", sort: "orderBy",order: "order", search:"search", nd:"nd"},
            colModel:[  
                {name:'id',index:'id', width:100, key: true, hidden: true},
                {name:'address',index:'address', width:130, align:"center" },
                {name:'repository',index:'repository', width:120, align:"center" }
            ],
            sortorder: "desc",
            rownumbers:true,
            viewrecords: true,
            scroll :false,
            pager:$('#transferPaper')
        });

注意到这里的设置值 datatype:“local”,一般为:“json”, 我们现在这里加载本地数据,设置此值。

   当用到 $.post()的请求时,就可以获得从URL获得 返回回来的数据data,自定义变量名接受data的数据(Java后台写的对象数据接收),接下来的数据表格列名与其相同即可。

   初来乍到,不足之处,望大牛指正,发文也是一个积累,记录的过程,此为初心,共同前行!

 

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值