天天看点

jquery easyui 中combogrid , datagrid 自定义分页

以             去掉记录相关字符

去掉前                                                                                        去掉后

jquery easyui 中combogrid , datagrid 自定义分页
jquery easyui 中combogrid , datagrid 自定义分页

第一中方法

1.取到combogrid的datagrid

var comDataGrid = $(itemId).combogrid('grid');

   comdataGrid只是一个table combogrid中的datagrid生成的table对象。断点调试添加监控可以看到是一个table对象

如下图

jquery easyui 中combogrid , datagrid 自定义分页

       在火狐中调试点击上图红色框中的table可以看到下图代码(图片代码就是一个combogird生成的一datagrid)

jquery easyui 中combogrid , datagrid 自定义分页

以上源码清楚以后就可以用jquery操作源代码,我们就可以为所欲为(jquery强大的功能你懂得)

var comDataGrid = $(itemId).combogrid('grid');

//查看源码找到需要操作的分页class进行操作

comDataGrid.parent().next().find(".pagination-info").hide();//此处隐藏成功 ;

当然为了更炫可以添加各式特效(这也是这种操作方法的好处)当然弊端也是有的,你必须保证控件已经解析完毕。

解决方案价格setTimeout(function () {

$(itemId).combogrid('grid').parent().next().find(".pagination-info").hide();//此处隐藏成功 ;

},0) setTimeout方法说明:这个方法是javascript自带方法当整个js加载执行完成后开始计时执行,所以只要将其放到combogrid解析的同你js就不会有问题。

第二种方法 通过jquery-easyui中提供的方法进行操作;

通过api我们可以了解到ComboGrid

依赖关系

  • combo
  • datagrid

 所以combogrid可以调用两者的属性方法事件都可以。

而datagrid

依赖关系

  • panel
  • resizable
  • linkbutton
  • pagination

而pagination

api中的一段说明详细见官方api

displayMsg string 显示页面信息。

所以就要隐藏页面信息。

如下代码:

         //初始化下拉

            selectControl.combogrid({

             此处省略代码段

            });

            //grid自定义

            var grid = selectControl.combogrid('grid');

            grid.datagrid({

                pagination: "false",

                pageSize: data.combox.pageSize == undefined ? 10 : data.combox.pageSize,

                pageList: [5, 10, 20]

            });

            //此处注释代码是说明pagination分页面板参数设置只做参考

            //            dg.datagrid('getPager').pagination({

            //                layout: ['list', 'sep', 'first', 'prev', 'sep', $('#p-style').val(), 'sep', 'next', 'last', 'sep', 'refresh']

            //            });

//隐藏页面信息

            grid.datagrid('getPager').pagination({ displayMsg:''});

            //分页事件

            grid.datagrid("getPager").pagination({

                onSelectPage: function (pageNumber, pageSize) {

                    queryParam.page = pageNumber;

                    queryParam.rows = pageSize;

                    //重新加载grid

                    loadData(grid, queryParam);

                }

            });

jquery  esayui 是一个开源而且功能相当强大的插件。开源我们可以根据自己需求随便改,js插件多平台都也引用。