easyUI功能扩展

    easyui功能完善

 

1.       在datagrid中首列标示“序号”二字

a)  修改jquery.easyui.min.js（如图）

代码：

var td=$("<tdrowspan=\""+opts.frozenColumns.length+"\"><divclass=\"datagrid-header-rownumber\">序号</div></td>");

b)  修改后的效果（如图）

2.      datagrid翻页，选中行还是会带着，在pub.js中增加如下方法。在查询和清空按钮上调用，可取消勾选当前页中的所有行。

    function removeSelected(){

       $('#dataTable').datagrid('uncheckAll');

    }

3.      没有数据时datagrid中显示“您好，目前系统没有查询到相应数据！”。这种方式是统一修改所有datagrid的方式，下边还有一种通过datagrid的view扩展的方式。

a)  修改jquery.easyui.min.js（如图）

代码：

//$.fn.datagrid.defaults.view.onAfterRender.call(this,_768);

var vc =$(_768).datagrid('getPanel').children('div.datagrid-view');

vc.next('div.datagrid-empty').remove();

if(!$(_768).datagrid('getRows').length){

    var d = vc.after('<div class="datagrid-empty"style="text-align:center;color:red;font-size:20px;">您好，目前系统没有查询到相应数据！</div>');

    $('div.datagrid-wrap').find('div.datagrid-pager').hide();

}else{

     $('div.datagrid-wrap').find('div.datagrid-pager').show();

}

b)  修改后的效果（如图）

4.      Datagrid列头右键显示（隐藏）

a)  在pubInclude.jsp中增加如下代码（如图）

代码：

//easyUI扩展右键隐藏

var createGridHeaderContextMenu= function(e, field) {

   e.preventDefault();

    var grid = $(this);/* grid本身 */

    var headerContextMenu= this.headerContext