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列的動態顯示了

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM