Xóa khả năng chọn các hàng cụ thể trong lưới ExtJS 4

Question

Tôi phải xóa khả năng chọn một số hàng trong lưới của mình.

tôi sử dụng CheckboxModel

selModel: Ext.create('Ext.selection.CheckboxModel', { 
    mode: 'SIMPLE' 
}) 

Để vô hiệu hóa lựa chọn tôi sử dụng beforeselect kiện

beforeselect: function (row, model, index) { 
    if (model.data.id == '3') { 
     return false; 
    } 
} 

Và để ẩn hộp kiểm Tôi sử dụng lớp học cụ thể cho hàng và css quy tắc

viewConfig: { 
    getRowClass: function(record, index) { 
     var id = record.get('id'); 
     return id == '3' ? 'general-rule' : ''; 
    } 
} 

.general-rule .x-grid-row-checker { 
    left: -9999px !important; 
    position: relative; 
} 

Có lẽ đây không phải là cách tốt nhất để đạt được kết quả mong muốn, nhưng đối với nhiệm vụ của tôi nó hoạt động.

Tuy nhiên, một sự cố khác xuất hiện: Chọn Tất cả/Bỏ chọn tất cả hộp kiểm tra trong tiêu đề lưới dừng hoạt động. Khi bạn lần đầu tiên bấm vào ckechbox này tất cả các dòng trừ những dòng không được chọn sẽ chọn, nhưng nếu bạn bấm lần nữa, không có gì xảy ra. Rõ ràng, hệ thống sẽ cố gắng chọn lại tất cả các hàng, vì không được chọn.

Có cách nào tốt hơn để giải quyết sự cố không? Hoặc cách giải quyết vấn đề với phương pháp này.

Điều duy nhất xuất hiện trong đầu - bạn cần phải viết lại các chức năng Chọn tất cả/Bỏ chọn tất cả cho hộp kiểm, nhưng tôi không chắc chắn cách tôi có thể thực hiện.

Cảm ơn trước vì câu trả lời của bạn và tôi xin lỗi nếu tôi đưa ra câu hỏi của mình không tuân theo các quy tắc.

Answer 1

Các giải pháp cuối cùng cho công việc của tôi (loại bỏ các khả năng lựa chọn một hàng cụ thể bằng id của nó) như sau:

Override SelectAll (và unselectAll nếu cần) phương pháp khi bạn xác định mô hình lựa chọn để bỏ qua hàng spicified:

selModel: Ext.create('Ext.selection.CheckboxModel', { 
    mode: 'SIMPLE', 
    select: function(records, keepExisting, suppressEvent) { 
     if (Ext.isDefined(records)) { 
      this.doSelect(records, keepExisting, suppressEvent); 
     } 
    }, 
    selectAll: function(suppressEvent) { 
     var me = this, 
      selections = me.store.getRange(); 

     for(var key in selections) { 
      if(selections[key].data.id == '3') { 
       selections.splice(key, 1); 
       break; 
      } 
     } 

     var i = 0, 
      len = selections.length, 
      selLen = me.getSelection().length; 

     if(len != selLen) { 
      me.bulkChange = true; 
      for (; i < len; i++) { 
       me.doSelect(selections[i], true, suppressEvent); 
      } 
      delete me.bulkChange; 

      me.maybeFireSelectionChange(me.getSelection().length !== selLen); 
     } 
     else { 
      me.deselectAll(suppressEvent); 
     } 
    } 
}) 

Sử dụng beforeselect kiện để vô hiệu hóa lựa chọn cho các hàng quy định:

beforeselect: function (row, model, index) { 
    if (model.data.id == '3') { 
     return false; 
    } 
} 

Sử dụng một lớp học đặc biệt dành cho các hàng quy định và nguyên tắc css tương ứng để che giấu hàng quy định:

viewConfig: { 
    getRowClass: function(record, index) { 
     var id = record.get('id'); 
     return id == '3' ? 'general-rule' : ''; 
    } 
} 

.general-rule .x-grid-row-checker { 
    left: -9999px !important; 
    position: relative; 
} 

Cảm ơn Evan Trimboli để được tư vấn!

Answer 2

Hiện không có móc nào được tích hợp sẵn để cho phép chức năng như vậy. Hộp kiểm tiêu đề gọi selectAll và deselectAll, vì vậy bạn sẽ cần phải ghi đè các phương pháp đó để ngăn chặn nó trên cơ sở mỗi bản ghi.