四时宝库

程序员的知识宝库

extjs 点击复选框在表格中增加相关信息行

 // 定义初始 存放表格数据
        var gridItems = ;

//省份复选框
        var $provinceCheckbox01 = new Ext.form.CheckboxGroup({
 xtype: 'checkboxgroup',
 fieldLabel: '省份选择',
 labelWidth: 60,
 columns: 9,
 vertical: true,
 margin: '10 0 0 15',
 defaults: {
 labelWidth: 80,
 width: 60,
 labelAlign: "left"
 },
 items: provinceItems,  //provinceItems是从其他渠道获取的数据
 listeners: {
 change: OnChange    // 复选框改变事件
 }
        });

//表格初始数据模型
var gridPanelStore = new Ext.data.Store({
 fields: ['discount', 'provinceId', 'provinceName'],
 data: {'items': ''},
 proxy: {
 type: 'memory',
 reader: {
 type: 'json',
 root: 'items'
 }
 }

        });

// grid
        var $grid = new Ext.grid.Panel({
 store: gridPanelStore,
 selType: 'rowmodel',
 singleSelect: true,
 margin: '20 0 0 0',
 columns: [{
 xtype: 'rownumberer',
 header: '序号',
 width: 70,
 align: 'center'
 }, {
 header: '省份',
 width: 150,
 sortable: true,
 menuDisabled: true,
 align: 'center',
 dataIndex: 'provinceName'
 }, {
 header: '折扣',
 width: 100,
 menuDisabled: true,
 sortable: true,
 align: 'center',
 dataIndex: 'discount',
 editor: {
 allowBlank: false
 }
 }],
 dockedItems: [{
 xtype: "pagingtoolbar",
 dock: "bottom",
 displayInfo: true
 }],
 plugins: [cellEditing]
        });

//事件监听
        function OnChange(newValue, oldValue, eOpts) {

 // 清空数据
 gridItems = ;

 //选中省份ID
 var checkedId = this.getValue.xxx;

 //判断选中数量
 if(checkedId==undefined){
 gridItems = ;
 } else if (checkedId.length == undefined) {
 for (var i = 0; i < provinceItems.length; i++) {
 if (provinceItems[i].inputValue == checkedId) {
 gridItems[0] = {
 "provinceId": checkedId,
 "provinceName": provinceItems[i].boxLabel,
 "discount": "1"
 };
 }
 }
 }else if(checkedId.length !== undefined){
 for(var j = 0;j<checkedId.length;j++){
 for (var o = 0; o < provinceItems.length; o++) {
 if (provinceItems[o].inputValue == checkedId[j]) {
 gridItems[j] = {
 "provinceId": checkedId[j],
 "provinceName": provinceItems[o].boxLabel,
 "discount": "1"
 };
 }
 }
 }
 }

 //console.log($gridItems);

 $grid.store.loadData($gridItems, false);

        }

最开始是想把取到的值,直接赋给 gridPanelStore.data.items ,但是赋值之后 用 store.reload 刷新表格数据总是报错,说是方法错了。

发表评论:

控制面板
您好,欢迎到访网站!
  查看权限
网站分类
最新留言
    友情链接