Iview的CheckboxGroup，on-change事件传值id+name

Posted 2023-05-03

参考技术A 方法：由于CheckboxGroup绑定的v-model的值就是Checkbox的label的值，所有只要给label处理就可以；:label="item.id+':'+item.tagName"

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

【中文标题】Extjs 4在父窗口关闭时保存checkboxGroup的状态

【英文标题】：Extjs 4 save state of a checkboxGroup when parent window is closed

【发布时间】：2012-08-24 15:34:33

【问题描述】：

我有一个带有 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'));

谢谢！

【参考方案1】：

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

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

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
  ]
);

【讨论】：

谢谢！我最终以不同的方式设计了我的应用程序，但任何人都可以确认这种方法有效吗？