jQueryEasyUi rownumbers数据太大,显示不全的解决之道

1.jquery.easyui.min.js文件中增加扩展方法:

$.extend($.fn.datagrid.methods, {
      fixRownumber :function(jq) {
            returnjq.each(function() {
                  varpanel = $(this).datagrid("getPanel");
                  //获取最后一行的number容器,并拷贝一份
                  varclone = $(".datagrid-cell-rownumber", panel).last().clone();
                  //由于在某些浏览器里面,是不支持获取隐藏元素的宽度,所以取巧一下
                  clone.css({
                        "position":"absolute",
                        left : -1000
                  }).appendTo("body");
                  varwidth = clone.width("auto").width();
                  //默认宽度是25,所以只有大于25的时候才进行fix
                  if(width > 25) {
                        //多加5个像素,保持一点边距
                        $(".datagrid-header-rownumber,.datagrid-cell-rownumber", panel).width(width + 5);
                        //修改了宽度之后,需要对容器进行重新计算,所以调用resize
                        $(this).datagrid("resize");
                        //一些清理工作
                        clone.remove();
                        clone =null;
                  }else{
                        //还原成默认状态
                        $(".datagrid-header-rownumber,.datagrid-cell-rownumber", panel).removeAttr("style");
                  }
            });
      }
});

2.在前台jsp中使用:

方法1:
$("#easyui-datagrid").datagrid({
                 onLoadSuccess :function() {
                       $(this).datagrid("fixRownumber");
                 }
           });
方法2:
onLoadSuccess:function(){
                  $(this).datagrid("fixRownumber");
            },


你可能感兴趣的:(js)