zoukankan      html  css  js  c++  java
  • ExtJS GridPanel的ColumnModel 动态加载

    var colM = "company,id,flyline";
    var colMArr = colM.split(",");
    var colLength = colMArr.length;
    var colMArray = new Array();
    for(var i=0; i<colLength; i++) {
        colMArray[i] = {header:colMArr[i], 75,dataIndex:fieldArray[i]}
         //此处的fieldArray[i]是fields的数据
    }
    //然后colMarray数组即是我们要动态构造的那个ColumnModel的参数,此处的动态的意
    //思是colM可以从request中获取,然后用来动态创建header即表头信息,同
    //理dataIndex也是一样的
    var column = new Ext.grid.ColumnModel(colMArray);
    //然后GridPanel中的制定cm属性值为column即可
    var storeCpye = new Ext.data.GroupingStore({
        proxy : new Ext.data.HttpProxy({
            url : 'cxgl_cpye.app?dateTime=' + new Date().getTime() + '&subTranCode=list'
        }),
        reader : new Ext.data.JsonReader({
            root : 'hstamcx',
            totalProperty : "results",
            fields : ["khbh","bankacc","fundacc","dxjgdm","cpdm","tazh"]
        }), 
        sortInfo : {
            field : 'cpdm',
            direction : 'DESC'
         },
        groupField : 'cpdm'
    });
    
    var colMArray = new Array();
    colMArray = [{header : "产品代码",    dataIndex : "cpdm",    width : 100},
                {header : "代销机构代码",    dataIndex : "dxjgdm",    width : 100},
               {header : "客户编号",    dataIndex : "khbh",    width : 100},
               {header : "理财账号",    dataIndex : "bankacc",    width : 100}, 
               {header : "客户资金账号",    dataIndex : "fundacc",    width : 100}
    
    var colQd = new Ext.grid.ColumnModel(colMArray);
        
    // GRID定义
    var gridCpye = new Ext.grid.GridPanel({
        id : 'cpye_grid',
        title:'[产品余额]查询',
        height : 800,
        stripeRows : true,
        bodyStyle : '100%',
        disableSelection : true,
        cm : colQd,
        viewConfig : {
            forceFit : false
        },
        store : storeCpye,
        iconCls : 'details',
        animCollapse : true,
        trackMouseOver : false,
        loadMask : {
            msg : '正在加载[产品余额]信息,请稍侯……'
        },
        //selModel : smQd,
        selModel : new Ext.grid.RowSelectionModel({singleSelect:true}),
        tbar : ['-',new Ext.form.Label({
            text : '产品代码:'
        }),new Ext.form.TextField({
            id : 'cpdm',
            name : 'cpdm',
            width : 130
        }),'-',new Ext.form.Label({
            text : '代销机构代码:'
        }), new Ext.form.TextField({
            id : 'dxjgdm',
            name : 'dxjgdm',
            width : 130
        }), '-', {
            pressed : true,
            text : '&nbsp;&nbsp;查&nbsp;&nbsp;&nbsp;&nbsp;询&nbsp;&nbsp;&nbsp;&nbsp;',
            iconCls : 'yes',
            handler : selinfo
        },'-',new Ext.Toolbar.Fill(),'-',new Ext.form.Label({
            text : ' 查询方式:  '
        }),new Ext.form.Radio({
                                id:"cpdm_radio",  
                                name : "select_method",  
                                inputValue : "cpdm desc,dxjgdm desc",
                                checked : true,    
                                boxLabel : " 产 品&nbsp;&nbsp;" 
                               
                            }),  
                    new Ext.form.Radio({
                                id:"dxjgdm_radio",  
                                name : "select_method",  
                                inputValue : "dxjgdm desc,cpdm desc",
                                boxLabel : "代销机构&nbsp;&nbsp;"
                            }),'-'
         ],
        bbar : new Ext.PagingToolbar({
            pageSize : 20,
            store : storeCpye,
            displayInfo : true,
            emptyMsg : '没有记录'
        })
    });
    
    function selinfo(){
        var cpdm_sel = Ext.get("cpdm").getValue();
        var dxjgdm_sel = Ext.get("dxjgdm").getValue();
        var select_method_sel = Ext.get("cpdm_radio").getValue();
        if(document.getElementById("dxjgdm_radio").checked){
            select_method_sel = Ext.get("dxjgdm_radio").getValue();
            colMArray[0] = {header : "代销机构代码",    dataIndex : "dxjgdm",    width : 100};
            colMArray[1] = {header : "产品代码",    dataIndex : "cpdm",    width : 100};
        }else{
            colMArray[0] = {header : "产品代码",    dataIndex : "cpdm",    width : 100};
            colMArray[1] = {header : "代销机构代码",    dataIndex : "dxjgdm",    width : 100};
        }
        var params = {};
        params.cpdm_sel = cpdm_sel;
        params.dxjgdm_sel = dxjgdm_sel;
        params.select_method_sel = select_method_sel;
        //params.whereStr = " and feetype in ('1','2')";
        storeCpye.baseParams = params;
        colQd = new Ext.grid.ColumnModel(colMArray);
        //gridCpye.reconfigure(storeCpye,colQd),
        storeCpye.load({
            callback : function(r, options, success) {
                if (success == true){
                    gridCpye.reconfigure(storeCpye,colQd);
                }else if (success == false) {
                    Ext.Msg.alert("错误", storeCpye.reader.jsonData.msg);
                }
            }
        });
    }
  • 相关阅读:
    解决org.openqa.selenium.WebDriverException: Unable to connect to host 127.0.0.1 on port 7055 after 45000 ms org.springframework.beans.BeanInstantiation
    jsp学习---css基础知识学习,float,position,padding,div,margin
    jsp学习---mvc模式介绍和el表达式,jstl标签库的使用入门
    java 查询 mongodb 中的objectid
    jsp学习---使用jsp和JavaBean实现超简单网页计算器
    jsp学习--JavaBean定义和在Jsp中使用JavaBean
    jsp学习--如何定位错误和JSP和Servlet的比较
    jsp学习--JSP运行原理,九大隐式对象和JSP常用标签
    jsp学习--基本语法和基础知识
    android开发学习---layout布局、显示单位和如何进行单元测试
  • 原文地址:https://www.cnblogs.com/mingforyou/p/3319843.html
Copyright © 2011-2022 走看看