切換複選框組中的複選框

Question

我有複選框組，其中8個複選框元素可用（星期幾）。當用戶點擊「ALL」複選框時，我想切換所有複選框。我試圖使用change事件checkboxgroup，但change事件僅在頁面加載時觸發。有沒有什麼方法或事件來製造這樣的事情？

{ 
xtype: 'checkboxgroup', 
id: 'cb-work-days', 
fieldLabel: 'PROMOSYON GÜNLERİ', 
labelWidth: '280px', 
inputWidth: 250, 
width: 530, 
columns: 4, 
vertical: true, 
margin: '0 0 15 0', 
items: [ 
    {boxLabel: 'PZT', name:'PROMO_WEEK_DAY', inputValue: '1'}, 
    {boxLabel: 'SAL', name:'PROMO_WEEK_DAY', inputValue: '2'}, 
    {boxLabel: 'ÇAR', name:'PROMO_WEEK_DAY', inputValue: '4'}, 
    {boxLabel: 'PER', name:'PROMO_WEEK_DAY', inputValue: '8'}, 
    {boxLabel: 'CUM', name:'PROMO_WEEK_DAY', inputValue: '16'}, 
    {boxLabel: 'CTS', name:'PROMO_WEEK_DAY', inputValue: '32'}, 
    {boxLabel: 'PAZ', name:'PROMO_WEEK_DAY', inputValue: '64'}, 
    {boxLabel: 'ALL', name:'PROMO_WEEK_DAY', inputValue: '128'} 
], 
listeners: { 
    change: function(cb, newValue) { 
     var val = parseInt(newValue['PROMO_WEEK_DAY']); 
     var cbs = Ext.getCmp('cb-work-days').getBoxes(); 

     if (val == 128) { 
      Ext.Array.each(cbs, function(cb) { 
       // cb.setValue(!cb.getValue()); 
       cb.setValue(true); 
      }) 
     } 
    } 
} 
} 

工作實例

{ 
xtype: 'checkboxgroup', 
id: 'cb-work-days', 
fieldLabel: 'PROMOSYON GÜNLERİ', 
labelWidth: '280px', 
inputWidth: 250, 
width: 530, 
columns: 4, 
vertical: true, 
margin: '0 0 15 0', 
items: [ 
    {boxLabel: 'PZT', name:'PROMO_WEEK_DAY', inputValue: '1'}, 
    {boxLabel: 'SAL', name:'PROMO_WEEK_DAY', inputValue: '2'}, 
    {boxLabel: 'ÇAR', name:'PROMO_WEEK_DAY', inputValue: '4'}, 
    {boxLabel: 'PER', name:'PROMO_WEEK_DAY', inputValue: '8'}, 
    {boxLabel: 'CUM', name:'PROMO_WEEK_DAY', inputValue: '16'}, 
    {boxLabel: 'CTS', name:'PROMO_WEEK_DAY', inputValue: '32'}, 
    {boxLabel: 'PAZ', name:'PROMO_WEEK_DAY', inputValue: '64'}, 
    { 
     boxLabel: 'ALL', 
     name:'PROMO_WEEK_DAY', 
     inputValue: '128', 
     listeners: { 
      change: function(cb, checked) { 
       var boxes = cb.up().query('checkbox:not([inputValue=128])'); 
       if (checked) { 
        Ext.each(boxes, function(box) { 
         box.setValue(true); 
        }) 
       } else { 
        Ext.each(boxes, function(box) { 
         box.setValue(false); 
        })      
       } 
      } 
     } 
    } 
] 
} 

Answer 1

監聽複選框本身的變化事件：

{ 
    xtype: 'checkboxgroup', 
    renderTo: Ext.getBody(), 
    id: 'cb-work-days', 
    fieldLabel: 'PROMOSYON GÜNLERİ', 
    labelWidth: '280px', 
    inputWidth: 250, 
    width: 530, 
    columns: 4, 
    vertical: true, 
    margin: '0 0 15 0', 
    items: [ 
     {boxLabel: 'PZT', name:'PROMO_WEEK_DAY', inputValue: '1'}, 
     {boxLabel: 'SAL', name:'PROMO_WEEK_DAY', inputValue: '2'}, 
     {boxLabel: 'ÇAR', name:'PROMO_WEEK_DAY', inputValue: '4'}, 
     {boxLabel: 'PER', name:'PROMO_WEEK_DAY', inputValue: '8'}, 
     {boxLabel: 'CUM', name:'PROMO_WEEK_DAY', inputValue: '16'}, 
     {boxLabel: 'CTS', name:'PROMO_WEEK_DAY', inputValue: '32'}, 
     {boxLabel: 'PAZ', name:'PROMO_WEEK_DAY', inputValue: '64'}, 
     {boxLabel: 'ALL', name:'PROMO_WEEK_DAY', inputValue: '128', 
      listeners: { 
       change: function(cb, checked) { 
        if (checked) { 
         var boxes = cb.up().query('checkbox:not([inputValue=128])'); 
         Ext.each(boxes, function(box) { 
          box.setValue(true); 
         }); 
        } 
       } 
      }} 
    ] 
} 

而且......你是指127爲貴「的所有「價值，而不是128 ...不是嗎？