zoukankan      html  css  js  c++  java
  • 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列的动态显示了

  • 相关阅读:
    在CentOS7上部署OpenStack 步骤详解
    Linux运维工程师工作手册
    Nginx+Keepalived实现Web服务器负载均衡
    Django Nginx+uwsgi 安装配置
    Docker-搭建Docker Registry
    centos7系统默认防火墙Firewall使用方法
    Shell脚本编写及常见面试题(二)
    Shell脚本编写及常见面试题(一)
    Linux之解决每次git pull/git push都需输入密码设置
    基于thinkphp5的Excel上传
  • 原文地址:https://www.cnblogs.com/mr-wuxiansheng/p/6504893.html
Copyright © 2011-2022 走看看