[转载]ExtJs CheckboxSelectionModel 全选问题 (2010-10-11 20:46:45)转载原文

来源:互联网 发布:ubuntu安装gfirefly 编辑:程序博客网 时间:2024/04/30 17:56
找了很久才找到的答案
原文地址:ExtJs CheckboxSelectionModel 全选问题作者:jacksparom

[转载]ExtJs <wbr>CheckboxSelectionModel <wbr>全选问题

效果如图所示:

解决方法:

//监视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();
            }
        }
 }

原创粉丝点击