zoukankan      html  css  js  c++  java
  • 动态改变gridpanel数据

    场景:当选择上面的ComboBox时,下面的Gridpanel值重新绑定,pagingtoolbar也改变,,首次加载与选择combobox时的调用的数据源方法不一样;

    首次加载:

       //获取Store
        var cityStore = new Ext.data.Store({
            proxy: new Ext.data.HttpProxy({
                url: '/ProvinceCity/GetCityList?c=' + new Date(),
                method: 'POST'
            }),
            reader: new Ext.data.JsonReader({ root: 'city', totalProperty: 'total' }, record)
        });

    var bBar = new Ext.PagingToolbar({
            pageSize: 10,
            store: cityStore,
            displayInfo: true,
            displayMsg: '显示 {0} 条到 {1} 条记录,一共 {2} 条',
            emptyMsg: '没有记录'
        });

    var cm = new Ext.grid.ColumnModel([
            { header: '编号', dataIndex: 'CityID', 200, align: 'center' },
            { id: 'city_name', header: '名称', dataIndex: 'CityName', 200, align: 'center' },
            { header: '拼音', dataIndex: 'CityPinYin', 200, align: 'center' },
            { header: '省份', dataIndex: 'ProvinceName', 200, align: 'center' }
        ]);

    var citygrid = new Ext.grid.GridPanel({
            id: 'city-grid',
            border: false,
            height: 300,
            layout: 'fit',
            autoExpandColumn: 'city_name',
            stripeRows: true,
            store: cityStore,
            bbar: bBar,
            cm: cm
        });

    当选择combobox时:

    var proCombox = new Ext.form.ComboBox({
            120,
            emptyText: '请选择...',
            store: proStore,
            mode: 'local',
            readOnly: true,
            valueField: 'ProvinceID',
            displayField: 'ProvinceName',
            typeAhead: true,
            triggerAction: 'all'
        });

        //选择下拉框重新加载对应的数据到gridpanel
        proCombox.on('select', function (comboBox) {
            cityStore = new Ext.data.Store({
                proxy: new Ext.data.HttpProxy({
                    url: '/ProvinceCity/GetCityListByProID?c=' + new Date(),
                    method: 'POST'
                }),
                reader: new Ext.data.JsonReader({ root: 'city', totalProperty: 'total' }, record),
                baseParams: { provinceID: comboBox.getValue() }
            });
            citygrid.getBottomToolbar().bind(cityStore);//重新绑定分页
            citygrid.reconfigure(cityStore, cm);//重新绑定gridpanel
            cityStore.load({ params: { start: 0, limit: 10} });
        });

  • 相关阅读:
    DP 水题 最长不下降子序列
    数的划分
    水题------纪念品分组
    NY95 众数问题
    NY86 找球号(一)
    C3-Zexal的矩阵链乘
    C3-Zexal的多路流水线调度
    C4-Zexal的食物链
    C4-排列
    C3-炮弹杀伤力
  • 原文地址:https://www.cnblogs.com/KimhillZhang/p/2394100.html
Copyright © 2011-2022 走看看