Primefaces樹複選框，避免選擇/取消對行的任意位置點擊時

Question

Primefaces提供http://www.primefaces.org/showcase/ui/treeSelectionCheckbox.jsf

這是一個不錯的選擇，除了「點擊行的任意一」的行爲是不是我所期待的。我需要其他按鈕和行上的東西。

Answer 1

您可以通過禁用的jQuery選擇覆蓋上樹節點標籤的單擊事件如下：

jQuery(".ui-treenode-label").click(function(){ 
    return false; 
}); 

確保創建運行每當樹通過AJAX渲染或更新的時間。

Answer 2

您需要重寫適用於treeTable的Primefaces Javascript。將下面的頁面上應Primefaces 3.5禁用此功能：

PrimeFaces.widget.TreeTable.prototype.bindSelectionEvents = function() { 
    var $this = this, 
    rowSelector = this.jqId + ' .ui-treetable-data tr.ui-treetable-selectable-node'; 

    $(document).off('mouseover.treeTable mouseout.treeTable click.treeTable', rowSelector) 
       .on('mouseover.treeTable', rowSelector, null, function(e) { 
        var element = $(this); 
        if(!element.hasClass('ui-state-highlight')) { 
         element.addClass('ui-state-hover'); 

         if($this.isCheckboxSelection()) { 
          element.find('> td:first-child > div.ui-chkbox > div.ui-chkbox-box').addClass('ui-state-hover'); 
         } 
        } 
       }) 
       .on('mouseout.treeTable', rowSelector, null, function(e) { 
        var element = $(this); 
        if(!element.hasClass('ui-state-highlight')) { 
         element.removeClass('ui-state-hover'); 

         if($this.isCheckboxSelection()) { 
          element.find('> td:first-child > div.ui-chkbox > div.ui-chkbox-box').removeClass('ui-state-hover'); 
         } 
        } 
       }) 
       .on('click.treeTable', rowSelector, null, function(e) { 
        // $this.onRowClick(e, $(this)); <-- commenting this out disables row selection 
        e.preventDefault(); 
       }); 

    if(this.isCheckboxSelection()) { 
     var checkboxSelector = this.jqId + ' .ui-treetable-data tr.ui-treetable-selectable-node td:first-child div.ui-chkbox-box'; 
     $(document).off('click.treeTable', checkboxSelector) 
        .on('click.treeTable', checkboxSelector, null, function(e) { 
         var node = $(this).closest('tr.ui-treetable-selectable-node'); 
         $this.toggleCheckboxNode(node); 
        }); 
    } 
}; 

這將覆蓋bindEvents的treetable中的（）函數和禁用的選擇，當您單擊行。確保您覆蓋了您所使用的特定版本的primefaces的JavaScript。