1

我陷入了一种情况,我必须通过“检查”位于工具栏中的复选框来“检查”列表中存在的所有复选框。

这是创建复选框列表的代码:-

itemTpl: '<input type="checkbox" name="box" enabled="enabled" value="open" 
name="comment_status" id="status" <tpl if="active">checked="checked"</tpl> />
{groupName}{#}',

这是我的复选框代码:-

var checkBox = {
            xtype: 'checkboxfield',
              name : 'all',
            //  label: 'All',
              itemId: 'all',
              value: 'all',
              lableWidth: "0",
              width: 1,
              padding: '0 0 15 30',
              checked: false,
              listeners: {
                  check:function() {
                     // alert("check");

                      item = Ext.get("status");
                      console.log("item:-"+Ext.JSON.encode(item));

                      chkBox = item.down('input').dom;

                      var checkboxes = Ext.getStore('group');
                      console.log(checkboxes.getCount());

                      for(var i=0;i<checkboxes.getCount();i++){
                       chkBox.checked = true;
                      }

                  },
                  uncheck:function(){
                     // alert("uncheck");
                  }
              }
        };

在上面的复选框检查中,我希望检查“itemTpl”中定义的所有复选框,反之亦然。我知道检查中的代码:function(){} 没有那么好解决我的问题(两个代码都在不同的观点)。

所以,请告诉我这个问题的一些解决方案。

提前谢谢。

4

1 回答 1

2

好的,我更新了您的 senchafiddle以使其正常工作。实质上,这是我添加到您的代码中的内容:

将 2 个函数添加到您的列表控制器中,以管理工具栏中复选框上的操作:

checkAll:function(){
    this.getCheckboxList().getStore().each(function(record){record.set('active', true);});
},
uncheckAll:function(){
    this.getCheckboxList().getStore().each(function(record){record.set('active', false);});
}

并在您的列表上方添加带有复选框的工具栏以将它们全部统治(XD):

   {
       xtype : 'toolbar',
       docked: 'top',
       title: 'Check !',
       items:[{
           xtype: 'checkboxfield',
           name : 'all',
           value: 'checkAll',
           listeners:{
               check:function(){
                   MyApp.app.getController('MainViewController').checkAll();
               },
               uncheck:function(){
                   MyApp.app.getController('MainViewController').uncheckAll();
               }
           }
       }]
   }

这将需要你的一些 css 来使 ckeckbox 更好,但行为就在这里。

于 2012-05-10T08:02:56.013 回答