Question

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

除了＆＃34;点击行中的任何地方＆＃34;它是一个很好的选择。行为不是我要找的。我需要其他按钮和行。

Answer 1

您需要覆盖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);
                  });
    }
};

这将覆盖TreeTable的bindEvents（）函数，并在单击该行时禁用选择。确保你覆盖了正在使用的特定版本的主要版本的javascript。

Answer 2

您可以通过jQuery覆盖tree-node-labels上的click事件来禁用选择，如下所示：

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

确保每次通过ajax渲染或更新树时都运行。

Primefaces Tree with checkbox，避免在单击行上的任何位置时选中/取消选中

2 个答案: