easyUI小技巧-纯干货

一、显示分页（pagination:true）情况下，隐藏每页显示的记录条数的那个select（即pageList），下图箭头

方法1：
onBeforeLoad:function(param){
    $("#"+$(this)[0].id).datagrid("getPager").pagination({
        showPageList:false
    });
},
onLoadSuccess:function(data){
    $("#"+$(this)[0].id).datagrid("getPager").pagination({
        showPageList:false
    });
}

方法2：
onBeforeLoad:function(param){
    $(".pagination-page-list").hide();
},
onLoadSuccess:function(data){
    $(".pagination-page-list").hide();
}

方法3：
css样式：select.pagination-page-list{display:none}

方法4：

$("#dgOrderList").datagrid({
    url:"。。。",
    queryParams:{。。。},
});

写在datagrid获取数据url之后，

        $("#dgOrderList").datagrid("getPager").pagination({
            showPageList: false
        });


二、在第n页，检索，利用queryParams方法，datagrid组装参数时，会自动添加page=n，而不会切换到第1页

方法1：

    $("#dgOrderList").datagrid({
        pageNumber:1,
        url:url,
        queryParams:{key:name,value:value}
    });
方法2：用load方法

    $dgOrderList.datagrid("load",param);//会自动添加&page=1&rows=。。

param为空对象时：$("#dgWorkers").datagrid("load",{});//会去除page、rows以外的参数，且置page=1

三、个人常用，mark一下

    $.messager.confirm("提示","确定要删除所选项目吗？",function(r){

        if (r){}
    })

四、linkbutton的disabled并不阻止事件，需要在事件中进行判断
    if($(this).linkbutton("options").disabled){
            return false;

    }

五、 dialog闪现问题。在一个页面使用一个dialog，初始隐藏（closed="true"），但是在页面刷新的一瞬间，这个dialog会显示出来，效果非常难看
方法一：
<div style="display:none">
    <div class="easyui-dialog"></div>
</div>
dialog用一个隐藏div包含起来，一个div包好几个diglog也可以，显示的时候直接dialog("open")就可以

方法二：

设定dialog的style  display:none，然后在页面加载完后再让它display:block或show()，或者$("dialog").show().dialog("open")

六、显示尾行合计（图片与下文无关）

    方法一，加载后在js中计算，但对formatter的列无效

//表格定义时显示footer
        showFooter:true,

//定义加载成功事件，列名：数据

        onLoadSuccess:function(data){

$(this).datagrid("reloadFooter", [{
                heJi:"合计",
                tNo:compute(data.rows, "tNo"),
                        workhour:compute(data.rows, "workhour"),
                pay:compute(data.rows, "pay"),
            }]);
         },


    //定义合计函数
    function compute(rows,colName) {
        var total = 0;
        for (var i = 0; i < rows.length; i++) {
            total += parseFloat(isNaN(rows[i][colName])||$.trim(rows[i][colName])==""?0:rows[i][colName]);
        }
        return parseFloat(total.toFixed(2));
    }


    方法二、后台返回一个footer行(PHP为例)

    showFooter:true,

    //footer行对应列要显示的内容，如合计后的内容，可以加一个标识如footer，用于标明改行是footer内容，在formatter时可能会用到
    $footer=array(array("heJi"=>"合计","tNo"=>$tNo,"workhour"=>$workhour,"pay"=>$pay,"footer"=>1));

//返回数据中以footer为键值
    echo json_encode(array("code"=>1,"msg"=>"查询成功","total"=>count($rows),"rows"=>$rows,"footer"=>$footer));
    
    注：footer行的显示同样受formatter影响

七、获得当前选中的tabs

1、 var index=$("#tabs").tabs("getTabIndex",$("#tabs").tabs("getSelected")); //从0开始 2、tabs的onSelect改变一个全局变量的值，用于标记选中的tab