代码之家  ›  专栏  ›  技术社区  ›  subbrl

带有复选框selModel的ExtJs Gridpanel窗口,第二次打开时不显示复选框

  •  0
  • subbrl  · 技术社区  · 10 年前

    我有一个网格面板,窗口内有复选框“选择模型”。

    在按钮单击处理程序上,窗口首次完美地打开带有复选框的网格。

    第二次或以后打开时,复选框不可见。我将在网格中创建显式实例 Ext.define() .

      selModel: Ext.create('Ext.selection.CheckboxModel', {
        mode: 'SIMPLE',
        checkOnly: true,
        listeners: {
            selectionchange: function (model, selections) {
                if (selections.length > 10) {
                    Ext.Msg.alert('Info', 'Max of only 10 selections allowed');
    
                    for (var i = 10; i < selections.length; i++) {
                        var record = selections[i];
                        model.deselect(record, true);
                    }
                }
            }
        }
    })
    

    我在哪里出错了?

    使现代化 :

    -在按钮处理程序内部-打开带有输入项的表单 -在表单提交时-在storeload中打开带有复选框网格的窗口

            checkGridStore.load({
                            scope: this,
                            callback: function (records, operation, success) {                               
                                var firstWindowWithCheckGrid= Ext.widget('gridwindow', {                                  
                                     id: 'firstWindowWithCheckGrid'
                                });
                                firstWindowWithCheckGrid.show();
                            }
                        });
    

    窗口配置:

     Ext.define('Sample.view.GridWindow', {
    extend: 'Ext.window.Window',
    alias: 'widget.gridwindow',
    height: 500,
    width: 1500,
    modal: true,
    layout: 'fit',
    forceFit: true,
    listeners: {
        beforeshow: function (window) {
            window.doLayout();
        }
    },
    buttons: [
        {
            text: 'Submit',
            handler: function () {
                var selectedRows = Ext.getCmp('statusGrid').getSelectionModel().getSelection();
    
                // do something
    
                Ext.getCmp('firstWindowWithCheckGrid').close();
    
    
                // do something
    
                secondStore.load({
                    scope: this,
                    callback: function (records, operation, flag) {
                        if (records.length > 0) {
                            var secondWindowWithoutCheckGrid = Ext.create('GridWindow', {
                                id: 'statusWindow',
                                items: {
                                    xtype: 'gridpanel'
    
                                },
                                buttons: [
                                    {
                                        text: 'Close',
                                        handler: function () {
                                            secondWindowWithoutCheckGrid .close();
                                        }
                                    }
                                ]
                            }).show();
                        }
                    }
                });
            }
        },
        {
            text: 'Close',
            handler: function () {
                try {
                    Ext.getCmp('firstWindowWithCheckGrid').close();
                } catch (error) {
    
                }
            }
        }
    ],
    initComponent: function () {
        this.items = [
            {
                xtype: 'statusgrid',
                id: 'statusGrid'
            }
        ]
        this.callParent(arguments);
    }
    

    });

    网格配置 :

     Ext.define('Sample.view.StatusGrid', {
    extend: 'Ext.grid.Panel',
    alias: 'widget.statusgrid',
    multiSelect: true,
    emptyText: 'No Matching Records',
    stripeRows: true,
    columnLines: true,
    store: 'SomeStore',
    autoScroll: true,
    margin: '5 5 5 5',
    selModel: Ext.create('Ext.selection.CheckboxModel', {
        mode: 'SIMPLE',
        listeners: {
            selectionchange: function (model, selections) {
                if (selections.length > 10) {
                    Ext.Msg.alert('Info', 'Max of only 10 selections allowed');
    
                    for (var i = 10; i < selections.length; i++) {
                        var record = selections[i];
                        model.deselect(record, true);
                    }
                }
            }
        }
    }),
    columns: [
       // columns
    
    ]
    initComponent: function () {
        this.callParent(arguments);
    }
    

    });

    1 回复  |  直到 10 年前
        1
  •  3
  •   subbrl    10 年前

    我是这样解决的-谢谢@EvanTrimboli的提示

    1. 我删除了 selModel 网格定义中的实例。

    2. 内部 initComponent 窗口配置 上面,我创建了 塞尔模型 config对象,并将其包含在 项目 -> 网格 以使复选框不再消失

      initComponent: function () {
      
      var selModel= Ext.create('Ext.selection.CheckboxModel', {
          mode: 'SIMPLE',
          hidden: true,
          listeners: {
              selectionchange: function (model, selections) {
                  if (selections.length > 10) {
                      Ext.Msg.alert('Info', 'Max of only 10 selections allowed');
      
                      for (var i = 10; i < selections.length; i++) {
                          var record = selections[i];
                          model.deselect(record, true);
                      }
                  }
              }
          }
      });
      
      this.items = [
      {
          xtype: 'statusgrid',
          id: 'statusGrid',
          selModel: selModel
      }
      ]
      this.callParent(arguments);
      }        
      

    谢谢大家的帮助!!!