$('#dg').datagrid({
url: 'url',
method: 'get',
fitColumns: true,
columns:[[
{field:'itemid',title:'Item ID',width:80}
]],
onHeaderContextMenu: function(e, field){
e.preventDefault();
$(this).datagrid('columnMenu').menu('show', {
left:e.pageX,
top:e.pageY
});
}
});
右击DataGrid表头,可以动态显示、隐藏列
(function($){
function buildMenu(target){
var state = $(target).data('datagrid');
if (!state.columnMenu){
state.columnMenu = $('<div></div>').appendTo('body');
state.columnMenu.menu({
onClick: function(item){
if (item.iconCls == 'tree-checkbox1'){
$(target).datagrid('hideColumn', item.name);
$(this).menu('setIcon', {
target: item.target,
iconCls: 'tree-checkbox0'
});
} else {
$(target).datagrid('showColumn', item.name);
$(this).menu('setIcon', {
target: item.target,
iconCls: 'tree-checkbox1'
});
}
}
})
var fields = $(target).datagrid('getColumnFields',true).concat($(target).datagrid('getColumnFields',false));
for(var i=0; i<fields.length; i++){
var field = fields[i];
var col = $(target).datagrid('getColumnOption', field);
state.columnMenu.menu('appendItem', {
text: col.title,
name: field,
iconCls: 'tree-checkbox1'
});
}
}
return state.columnMenu;
}
$.extend($.fn.datagrid.methods, {
columnMenu: function(jq){
return buildMenu(jq[0]);
}
});
})(jQuery);
Easyui 右击DataGrid表头,可以动态显示、隐藏列
最新推荐文章于 2021-08-13 11:26:46 发布