ExtJs CheckboxSelectionModel 全选操作后 清空表格头的checkBox

 

extjs 全选后点击删除后 全选框仍然还选中，应该删除后全选框应该不选中。

 

 

解决方法：

在删除事件中加入以下方法：

function autoCheckGridHead(){
  var hd_checker = Ext.getCmp("grid-sysmsg").getEl().select('div.x-grid3-hd-checker');  

     var hd = hd_checker.first(); 
     //清空表格头的checkBox  
     if(hd.hasClass('x-grid3-hd-checker-on')){
                 hd.removeClass('x-grid3-hd-checker-on');
                 }
                 
 }

下面是一段我在网上看到的代码，可以参考一下。

解决方法：

//监视Store数据是否变化, 进行一些其它处理;

pl_store.on('datachanged', function() {
 var hd = pl_grid.getEl().select('div.x-grid3-hd-checker');
 if (pl_grid.getSelectionModel().getSelections().length != pageCount) { // 没有全选的话
  // 清空表格头的checkBox
  if (hd.hasClass('x-grid3-hd-checker-on')) {
   hd.removeClass('x-grid3-hd-checker-on'); // x-grid3-hd-checker-on
  }
 } else {
  if (!hd.hasClass('x-grid3-hd-checker-on')) {
   hd.addClass('x-grid3-hd-checker-on'); // x-grid3-hd-checker-on
  }
 }
});

以前写的这个实现（上面一段代码）有问题

pl_grid.getEl().select('div.x-grid3-hd-checker'); 

找错element了，呵呵，可能导致Grid头的checkbox不可用;

请参考下边这个实现：

 //自动判断是否全选并选中或不选中表头的checkbox
 function autoCheckGridHead(){
  var hd_checker = grid_taskQueryPop.getEl().select('div.x-grid3-hd-checker');  

     var hd = hd_checker.first(); 
     if(hd != null){ 
      if(grid_taskQueryPop.getSelectionModel().getSelections().length != 

                grid_taskQueryPop.getStore().getCount()){ 
                //清空表格头的checkBox  
                if(hd.hasClass('x-grid3-hd-checker-on')){
                 hd.removeClass('x-grid3-hd-checker-on');     //x-grid3-hd-checker-on
                 //grid_taskQueryPop.getSelectionModel().clearSelections();
             }
            }else{
             if(grid_taskQueryPop.getStore().getCount() == 0){ //没有记录的话清空;
              return;
             }
             hd.addClass('x-grid3-hd-checker-on');
                grid_taskQueryPop.getSelectionModel().selectAll();
            }
        }
 }