Extjs 4在父窗口关闭时保存checkboxGroup的状态

Extjs 4 save state of a checkboxGroup when parent window is closed

本文关键字：保存 checkboxGroup 状态窗口 Extjs 更新时间：2023-09-26

我有一个带有checkboxGroup的窗口。我希望在按下窗口上的"应用"按钮时，保存在checkboxGroup中所做的任何选择。到目前为止，我有

                xtype: 'checkboxgroup',
                    stateful: true,
                    stateID: 'checks',
                    getState: function() {
                            return {
                                    items: this.items
                            };
                    },
                    stateEvents: ['close'],
                    columns: 2,
                    vertical: false,
                    items: [...]

我很确定我的stateEvents是错误的，当父窗口关闭时，我用什么来指示我希望保存状态？

我在我的app.js文件的启动函数中有这一行，就在我创建顶部视口之前

            Ext.state.Manager.setProvider(Ext.create('Ext.state.CookieProvider'));

谢谢！

显然，复选框组的状态不包括复选框的值http://docs.sencha.com/ext-js/4-0/#/api/Ext.form.CheckboxGroup-方法-状态

我必须通过会话变量和父窗口事件。。

var configPopup;
var configForm = Ext.create('Ext.form.Panel', {
    id: 'form-config',
    name: 'form-config',
    frame: true,
    layout: 'anchor',
    items: [
      {
        border:0,
        anchor: "100%",
        xtype: 'checkboxgroup',
        fieldLabel: 'Include options',
        labelWidth: 100,
        id: 'opt_relation',
        labelStyle: 'margin-left:10px;',
        items: [
          {         
        boxLabel: 'relation 1',
        name: 'opt_relation',
        inputValue: 'rel1',
        checked: true
      },
      {
        boxLabel: 'relation 2',
        name: 'opt_relation',
        inputValue: 'rel2',
        checked: true
      },
      {
        boxLabel: 'relation 3',
        name: 'opt_relation',
        inputValue: 'rel3',
        checked: true
       }
     ]
   }        
    ],
buttons: [
      {
      text: 'Close',
    handler: function() {
      configPopup.hide();
    }
  }]
});

configPopup = new Ext.Window({
  id:'configPopup',
  title: 'Chart configuration',
  layout      : 'fit',
  width       : 390,
  closeAction :'hide',
  plain       : true,
  listeners: {
    show: function() { 
      var v = Ext.state.Manager.get("optRelation");
      if (v) {        
        Ext.getCmp('opt_relation').setValue(v);
      } 
    },
    hide: function() { 
      var v = Ext.getCmp('opt_relation').getValue();      
      Ext.state.Manager.set("optRelation",v); 
    }
  },
  items : [ 
    configForm
  ]
});