easyui 隐藏input_easyui datagrid 隐藏 | 学步园

easyui datagrid 隐藏列

1、隐藏前图

2、隐藏后图

3、代码1

$("#corp-grid").datagrid({

title:"泥头车企业管理",

toolbar:"#corp-grid-toolbar",

border:false,

fit:true,

width:$(window).width()-252,

columns:[[

{field:"ckb",checkbox:true},

{field:"corpName",title:"企业名称",width:200,halign:"center",align:"center",resizable:true},

{field:"linkedCorpName",title:"挂靠深圳企业名称",width:200,halign:"center",align:"center",resizable:true},

{field:"corpType",title:"企业类型",width:80,align:"center",resizable:false},

{field:"businessScope",title:"经营范围",width:80,align:"center",resizable:false},

{field:"effectiveDate",title:"有效日期",width:80,align:"center",resizable:false},

{field:"opePeriod",title:"营业期限",width:80,align:"center",resizable:false},

{field:"ifLocal",title:"是否本地",width:80,align:"center",resizable:false},

{field:"state",title:"有效状态",width:80,align:"center",resizable:false}

]],

//striped:true,

fitColumns:true,

//autoRowHeight:true,

rownumbers:false,

singleSelect:false,

ctrlSelect:true,

pagination:true,

pageSize:10,

pageList:[5,10,15,20,25,30],

sortName:"corpId",

sortOrder:"desc",

url:"corp_getInfoList.action",

method:"post",

loadMsg:"加载数据中，请稍后",

onDblClickRow:function(rowIndex, rowData){

openDialog({

type:"view",

title:"泥头车企业信息查看",

width:800,

height:400,

maximizable:true,

href:"BaseInfo/Corp/CorpInfoView.html"

});

},

onRowContextMenu:function(e, rowIndex, rowData){

e.preventDefault();

$(this).datagrid("unselectAll");

$(this).datagrid("selectRow", rowIndex);

$("#corp-menu").menu("show",{

left:event.pageX,

top:event.pageY

});

}

}).datagrid("columnHiding");

4、代码2

$.extend($.fn.datagrid.methods,{

columnHiding:function(jq){

return jq.each(function(){

var grid = this;

var variable = 2;

var tds = $(grid).datagrid("getPanel").find(".datagrid-header td[field]:not(td[field='ckb'])");

var downDiv = null;

if($(".dg-hide-div").length == 0){

downDiv = $("

downDiv.addClass("dg-hide-div");

downDiv.hide();

$("body").append(downDiv);

}else{

downDiv = $(".dg-hide-div");

}

downDiv.click(function(){

tbDiv.show();

}).mouseout(function(){

var tbVisible = tbDiv.is(":visible");

if(!tbVisible){

$(this).hide();

}

});

var tbDiv = null;

if($(".dg-hide-tb").length == 0){

tbDiv = $("

tbDiv.addClass("dg-hide-tb");

tbDiv.hide();

$("body").append(tbDiv);

}else{

tbDiv = $(".dg-hide-tb");

tbDiv.children("table").children().remove();

}

var trs = "";

var columns = ($(grid).datagrid("options").columns)[0];

$.each(columns,function(index, obj){

if(index > 0){

trs += "

";

trs += "

" + obj.title + "";

trs += "

";

}

});

tbDiv.children().append($(trs));

tbDiv.mouseout(function(e){

var minX = $(this).offset().left;

var curMouseX = e.pageX;

var maxX = $(this).offset().left + $(this).width();

var minY = $(this).offset().top;

var curMouseY = e.pageY;

var maxY = $(this).offset().top + $(this).height();

var ifOverThis = (curMouseX >= minX && curMouseX < maxX)

&& (curMouseY >= minY && curMouseY <= maxY);

if(!ifOverThis){

downDiv.hide();

$(this).hide();

}

});

tbDiv.children().find("input[type='checkbox']").click(function(){

var checked = $(this).is(":checked");

var visibleTds = $(grid).datagrid("getPanel")

.find(".datagrid-header td[field]:visible").length - 1;

if(1 == visibleTds && !checked){

return false;

}

var field = $(this).parent().next().attr("id");

if(checked){

$(grid).datagrid("showColumn", field);

}else{

$(grid).datagrid("hideColumn", field);

}

});

tds.mouseover(function(){

tbDiv.hide();

var thisOffset = $(this).offset();

var height = $(this).height();

var left = null;

var visibleTds = $(this).parent().children(":visible");

var lastTd = visibleTds[visibleTds.length - 1];

if($(this).index() == $(lastTd).index()){

left = thisOffset.left + variable;

}else{

left = thisOffset.left + $(this).width() - downDiv.width() - variable;

}

var top = thisOffset.top;

downDiv.css({height:height, left:left, top:top});

tbDiv.css({left:left,top:top+height+1});

downDiv.show();

}).mouseout(function(e){

var minY = $(this).offset().top;

var curMouseY = e.pageY;

var maxY = $(this).offset().top + $(this).height();

var minX = null;

var curMouseX = e.pageX;

var maxX = null;

var visibleTds = $(this).parent().children(":visible");

var lastTd = visibleTds[visibleTds.length - 1];

if($(this).index() == $(lastTd).index()){

minX = $(this).offset().left + variable;

maxX = $(this).offset().left + downDiv.width() + variable;

}else{

minX = $(this).offset().left + $(this).width() - downDiv.width() - variable;

maxX = $(this).next().offset().left - variable;

}

var ifOverThis = (curMouseX >= minX && curMouseX <= maxX)

&& (curMouseY >= minY && curMouseY <= maxY);

if(!ifOverThis){

downDiv.hide();

}

});

});

}

});

文章如果对你有帮助,请