easyui datagrid 表格动态隐藏部分列的展示
1.一套代码中,可能不同的项目情况都在用,但是可能不同的项目要求展示的datagrid列的内容并不一致,所以能够动态的显示部分datagrid列的内容。
即datagrid的中的某一列,这个项目要求显示那个项目要求不显示。
2.js代码实现
function gridLoad() { $('#t_auclot').datagrid( { idField : 'id', // 只要创建数据表格 就必须要加 ifField title : '拍卖列表', fit : true, url : parent.baseUrl + 'auction/auclot, method : 'GET', fitColumns : false, nowrap : false, singleSelect:true, // striped : true, // 隔行变色特性 loadMsg : '数据正在加载,请耐心的等待...', rownumbers : true, sortName : 'crtTime', sortOrder : 'desc', rowStyler : function(index, record) { }, /*frozenColumns : [ [ // 冻结列特性 ,不要与fitColumns 特性一起使用 { field : 'ck', width : 50, checkbox : true * formatter: function(value, rowData, rowIndex){ return '<input * type="radio" name="selectRadio" * id="selectRadio"'+rowIndex+'value="'+rowData.id+'"/>'; } } ] ],*/ columns : [ [ { field : 'auclot', title : '操作', width : 240, align : 'center', formatter : aucLotFtt }, { field : 'plateNum', title : '车牌号', width : 75, sortable :true, align : 'center' }, { field : 'aucLotSettled', title : '结算情况', width : 70, align : 'center', formatter : aucLotSettledFtt } ] ], onLoadSuccess:function(data){ if(!top.checkHiddenSet("plateNumFlag")){ $("#t_auclot").datagrid("hideColumn", "aucLotSettled"); // 设置隐藏列 }else{ $("#t_auclot").datagrid("hideColumn", "plateNum"); // 设置隐藏列 } if(top.checkHiddenSet("stageFlag")){ $("#t_auclot").datagrid("hideColumn", "stage"); // 设置隐藏列 $("#stageResearch").hide();//隐藏上拍阶段的搜索框 } if(top.checkHiddenSet("typeFlag")){ $("#t_auclot").datagrid("hideColumn", "type"); //设置隐藏列 } } , pagination : true, pageSize : 10, pageList : [ 5, 10, 15, 20, 50 ], toolbar : toolbarFtt() }); };
3.以上,做法,就能够做到,datagrid列的动态显示了