EasyUI datagrid 笔记

个人笔记，不定时更新，记录学习点滴 :)

郑重声明：本人新手一只，因此笔记无法保证准确性，仅仅作为个人的学习记录，如有问题欢迎大家留言指导，共同学习进步

1.清空datagrid:

 $("#addNumTable").datagrid('loadData',{total:0,rows:[]});

还有一种方法，自己没有试过

var item = $('#filegrid').datagrid('getRows'); 
if (item) { 
for (var i = item.length - 1; i >= 0; i--) { 
var index = $('#filegrid').datagrid('getRowIndex', item[i]); 
$('#filegrid').datagrid('deleteRow', index); 
} 
}

2.获取单元格的值：

//getSelected返回第一个被选中的行，没有记录被选中返回一个空数组
//获取所有行的数据结果是一个数组
var m=$("#addNumTable").datagrid("getRows");
//获取第一行的perfix字段的值
var data=m[0].perfix
//获取所有行的perfix字段值
var perfix="";
for(i=0;i<data.length;i++){
 perfix+=i==data.length-1?data[i].perfix:data[i].perfix+","
}

//获取所有被选中的行的数据(数组)
var m=$("#addNumTable").datagrid("getSelections");
//获取第一行的perfix字段的值
var data=m[0].perfix

//获取所有复选框被选中的行
var m=$("#addNumTable").datagrid("getChecked");
//获取第一行的perfix字段的值
var data=m[0].perfix

3.如何提取某一行数据？

   ……省略datagrid其他部分
      columns: [
                        [
                         {
                           field: 'notField6', title: '操作', 200, align: 'center', formatter: function (v, o) {
                                  var s=JSON.stringify(o);
                                  return    "<a href='javascript:void(0)' onclick='pushDetail("+s+")'>推送</a>";
                                  }
                       },
                       ]
                  ]

   ……省略datagrid其他部分

接着可以由相应的函数进行接收

            function  pushDetail(param){
                console.log(typeof(param));//object
                console.log(param);
            }

发现这时的param变成了一个object，暂时还不太明白怎么回事，但是可以确定的是这里确实可以按照对对象的处理方法对这条记录为所欲为

4.如何禁止datagrid自动加载？(2016.3.1)

可以使用datagrid的onBeforeLoad:function(){}方法来实现

定义一个全局变量：

var  token=1;

datagrid部分代码：

onBeforeLoad:function(){
            if(token){//禁用自动加载
             return false;
     }
},

在查询时更改token即可：

 $("#seachBtn").click(function () {
                token=0;
       $('#dg').datagrid("load", $("#queryForm").serializeObject());
 });

或者直接这样写（在点击查询按钮时请求数据）

 $("#seachBtn").click(function () {
       $('#dg').datagrid({
               url:'',
               queryParams:$("#queryForm").serializeObject()
      });
 });

这样写的话外面就不要对datagrid的URL赋值了，(2016.10.13更新)发现这样写有一个问题，如果你的分页是这么写的，

 $('#mainTable').datagrid("getPager").pagination({
    pageList : [ 20, 50, 100,200 ]
});

　　再用以上这种写法的时候就会出现分页组件“还原”的问题，具体为在点击查询的时候分页组件又变成了[10,20,30,40,50](默认值)，你自定义的分页组件失效了！

好吧，还是用第一种方法可能会更合适些。

2016.4.1更新

以上两种写法中第一种是LOAD方式第二种则是RELOAD模式，它们在使用时还是有区别的，前者在查询时默认查询第一页，后者默认查询当前页，所以就可能会出现二次查询的问题；

总页码	30	30	30
当前页码	20	21	22
更改查询条件后总页码	21	21	21
查询次数	1	1	2(第二次以21为页码)
查询后页码	20	21	21

测试结果如上表所示，一旦当前页码超过了第二次查询时的总页码，就会出现二次查询的情况，且是其最大页码;

另外，测试发现pagination控件中，在更改页码时实际上也是一种reload方式请求数据，并且它会将第一次获取数据时的参数保存下来，以后在翻页操作时以首次查询时的参数为条件请求数据

5、如何在选项卡页面中获取TAB组件？ (2016.3.9 11:23:41)

//选项卡页面中取得父页面中的id=ta的tab
var jq=top.jQuery;
//一些操作
jq("#ta").tabs("getSelected");

待续……