Fixed #2218

components/common/api.ts

@@ -63,6 +63,7 @@ export interface TreeNode {
     styleClass?: string;
     draggable?: boolean;
     droppable?: boolean;
+    selectable?: boolean;
 }
 
 export interface Confirmation {

components/tree/tree.css

@@ -2,7 +2,7 @@
     width: 18em;
 }
 
-.ui-tree.ui-tree-selectable .ui-treenode-content {
+.ui-tree .ui-treenode-selectable.ui-treenode-content {
     cursor: pointer;
 }
 

components/tree/tree.ts

@@ -1,4 +1,4 @@
-import {NgModule,Component,Input,AfterContentInit,OnDestroy,Output,EventEmitter,OnInit,OnDestroy,EmbeddedViewRef,ViewContainerRef,
+import {NgModule,Component,Input,AfterContentInit,OnDestroy,Output,EventEmitter,OnInit,EmbeddedViewRef,ViewContainerRef,
     ContentChildren,QueryList,TemplateRef,Inject,forwardRef,Host} from '@angular/core';
 import {CommonModule} from '@angular/common';
 import {TreeNode} from '../common/api';
@@ -41,7 +41,7 @@ export class TreeNodeTemplateLoader implements OnInit, OnDestroy {
             <li class="ui-treenode {{node.styleClass}}" *ngIf="!tree.horizontal" [ngClass]="{'ui-treenode-leaf': isLeaf()}">
                 <div class="ui-treenode-content" (click)="onNodeClick($event)" (contextmenu)="onNodeRightClick($event)" (touchend)="onNodeTouchEnd()"
                     (drop)="onDropNode($event)" (dragover)="onDropNodeDragOver($event)" (dragenter)="onDropNodeDragEnter($event)" (dragleave)="onDropNodeDragLeave($event)"
-                    [ngClass]="{'ui-treenode-selectable':tree.selectionMode,'ui-treenode-dragover':draghoverNode}" [draggable]="tree.draggableNodes" (dragstart)="onDragStart($event)" (dragend)="onDragStop($event)">
+                    [ngClass]="{'ui-treenode-selectable':tree.selectionMode && node.selectable !== false,'ui-treenode-dragover':draghoverNode}" [draggable]="tree.draggableNodes" (dragstart)="onDragStart($event)" (dragend)="onDragStop($event)">
                     <span class="ui-tree-toggler  fa fa-fw" [ngClass]="{'fa-caret-right':!node.expanded,'fa-caret-down':node.expanded}"
                             (click)="toggle($event)"></span
                     ><div class="ui-chkbox" *ngIf="tree.selectionMode == 'checkbox'"><div class="ui-chkbox-box ui-widget ui-corner-all ui-state-default">
@@ -426,7 +426,12 @@ export class Tree implements OnInit,AfterContentInit,OnDestroy {
         if(eventTarget.className && eventTarget.className.indexOf('ui-tree-toggler') === 0) {
             return;
         }
-        else {
+        else if(this.selectionMode) {
+            console.log(node);
+            if(node.selectable === false) {
+                return;
+            }
+
             let index = this.findIndexInSelection(node);
             let selected = (index >= 0);
 

components/treetable/treetable.ts

@@ -8,7 +8,7 @@ import {DomHandler} from '../dom/domhandler';
 @Component({
     selector: '[pTreeRow]',
     template: `
-        <div class="ui-treetable-row" [ngClass]="{'ui-state-highlight':isSelected(),'ui-treetable-row-selectable':treeTable.selectionMode}">
+        <div class="ui-treetable-row" [ngClass]="{'ui-state-highlight':isSelected(),'ui-treetable-row-selectable':treeTable.selectionMode && node.selectable !== false}">
             <td *ngFor="let col of treeTable.columns; let i=index" [ngStyle]="col.style" [class]="col.styleClass" (click)="onRowClick($event)" (touchend)="onRowTouchEnd()">
                 <a href="#" *ngIf="i==0" class="ui-treetable-toggler fa fa-fw ui-c" [ngClass]="{'fa-caret-down':node.expanded,'fa-caret-right':!node.expanded}"
                     [ngStyle]="{'margin-left':level*16 + 'px','visibility': isLeaf() ? 'hidden' : 'visible'}"
@@ -176,7 +176,11 @@ export class TreeTable {
         if(eventTarget.className && eventTarget.className.indexOf('ui-treetable-toggler') === 0) {
             return;
         }
-        else {
+        else if(this.selectionMode) {
+            if(node.selectable === false) {
+                return;
+            }
+
             let metaSelection = this.rowTouched ? false : this.metaKeySelection;
             let index = this.findIndexInSelection(node);
             let selected = (index >= 0);

showcase/demo/tree/treedemo.html

@@ -196,11 +196,17 @@ <h3>Getting Started</h3>
                             <td>Whether to disable dragging for a particular node even if draggableNodes is enabled.</td>
                         </tr>
                         <tr>
-                            <td>styleClass</td>
-                            <td>string</td>
+                            <td>droppable</td>
+                            <td>boolean</td>
                             <td>null</td>
                             <td>Whether to disable dropping for a particular node even if droppableNodes is enabled.</td>
                         </tr>
+                        <tr>
+                            <td>selectable</td>
+                            <td>boolean</td>
+                            <td>null</td>
+                            <td>Used to disable selection of a particular node.</td>
+                        </tr>
                     </tbody>
                 </table>
             </div>
@@ -395,6 +401,8 @@ <h3>Selection</h3>
 </code>
 </pre>
 
+            <p>Selection of a particular node can be disabled by setting the selectable property of the node to false.</p>
+
             <h3>Icons</h3>
             <p>Icon of a treenode is defined using the icon property, if you need an icon depending on the expand or collapse state, use
                 expandedIcon and collapsedIcon instead.</p>

showcase/demo/treetable/treetabledemo.html

@@ -473,6 +473,8 @@ <h3>Selection</h3>
 &#125;
 </code>
 </pre>
+
+            <p>Selection of a particular node can be disabled by setting the selectable property of the node to false.</p>
 
             <h3>Templating</h3>
             <p>By default label of a treenode is displayed inside a tree node, in case you need to place custom content define a ng-template inside a column that gets