TreeTable - ContextMenu

ContextMenu has special integration with TreeTable. Even different menus can be assigned to different node types by matching node types.

Documentation

Name	Size	Type
Documents	-	Folder
Pictures	-	Folder
Movies	-	Folder

<style type="text/css">
    .ui-treetable table {
        table-layout: fixed
    }
    
    .value {
        font-weight: bold
    }
</style>


<h:form id="form">            
    <p:treeTable id="docs" value="#{ttContextMenuView.root}" var="document" selectionMode="single" selection="#{ttContextMenuView.selectedNode}">
        <f:facet name="header">
            Document Viewer
        </f:facet>
        <p:column headerText="Name">
            <h:outputText value="#{document.name}" />
        </p:column>
        <p:column headerText="Size">
            <h:outputText value="#{document.size}" />
        </p:column>
        <p:column headerText="Type">
            <h:outputText value="#{document.type}" />
        </p:column>
    </p:treeTable>
    
    <p:contextMenu for="docs">
        <p:menuitem value="View" update="documentPanel" icon="pi pi-search" oncomplete="PF('documentDialog').show()"/>
        <p:menuitem value="Delete" action="#{ttContextMenuView.deleteNode}" update="docs" icon="pi pi-times"/>
    </p:contextMenu>
    
    <p:dialog id="dialog" header="Document Detail" showEffect="fade" widgetVar="documentDialog" modal="true" resizable="false">
        <p:outputPanel id="documentPanel">
            <p:panelGrid  columns="2" columnClasses="label,value" rendered="#{not empty ttContextMenuView.selectedNode}">
                <h:outputLabel for="name" value="Name: " />
                <h:outputText id="name" value="#{ttContextMenuView.selectedNode.data.name}" style="font-weight:bold" />

                <h:outputLabel for="size" value="Size: " />
                <h:outputText id="size" value="#{ttContextMenuView.selectedNode.data.size}" style="font-weight:bold" />

                <h:outputLabel for="type" value="Type " />
                <h:outputText id="type" value="#{ttContextMenuView.selectedNode.data.type}" style="font-weight:bold" />
            </p:panelGrid>
        </p:outputPanel>
    </p:dialog>
</h:form>

@Named("ttContextMenuView")
@ViewScoped
public class ContextMenuView implements Serializable {
    
    private TreeNode root;
    
    private TreeNode selectedNode;
        
    @Inject
    private DocumentService service;
    
    @PostConstruct
    public void init() {
        root = service.createDocuments();
    }

    public TreeNode getRoot() {
        return root;
    }

    public void setService(DocumentService service) {
        this.service = service;
    }

    public TreeNode getSelectedNode() {
        return selectedNode;
    }

    public void setSelectedNode(TreeNode selectedNode) {
        this.selectedNode = selectedNode;
    }
    
    public void deleteNode() {
        selectedNode.getChildren().clear();
        selectedNode.getParent().getChildren().remove(selectedNode);
        selectedNode.setParent(null);
        
        selectedNode = null;
    }
}

@Named
@ApplicationScoped
public class DocumentService {
    
    public TreeNode createDocuments() {
        TreeNode root = new DefaultTreeNode(new Document("Files", "-", "Folder"), null);
		
		TreeNode documents = new DefaultTreeNode(new Document("Documents", "-", "Folder"), root);
		TreeNode pictures = new DefaultTreeNode(new Document("Pictures", "-", "Folder"), root);
		TreeNode movies = new DefaultTreeNode(new Document("Movies", "-", "Folder"), root);
		
		TreeNode work = new DefaultTreeNode(new Document("Work", "-", "Folder"), documents);
		TreeNode primefaces = new DefaultTreeNode(new Document("PrimeFaces", "-", "Folder"), documents);
		
		//Documents
		TreeNode expenses = new DefaultTreeNode("document", new Document("Expenses.doc", "30 KB", "Word Document"), work);
		TreeNode resume = new DefaultTreeNode("document", new Document("Resume.doc", "10 KB", "Word Document"), work);
		TreeNode refdoc = new DefaultTreeNode("document", new Document("RefDoc.pages", "40 KB", "Pages Document"), primefaces);
		
		//Pictures
		TreeNode barca = new DefaultTreeNode("picture", new Document("barcelona.jpg", "30 KB", "JPEG Image"), pictures);
		TreeNode primelogo = new DefaultTreeNode("picture", new Document("logo.jpg", "45 KB", "JPEG Image"), pictures);
		TreeNode optimus = new DefaultTreeNode("picture", new Document("optimusprime.png", "96 KB", "PNG Image"), pictures);
		
		//Movies
		TreeNode pacino = new DefaultTreeNode(new Document("Al Pacino", "-", "Folder"), movies);
		TreeNode deniro = new DefaultTreeNode(new Document("Robert De Niro", "-", "Folder"), movies);
		
		TreeNode scarface = new DefaultTreeNode("mp3", new Document("Scarface", "15 GB", "Movie File"), pacino);
		TreeNode carlitosWay = new DefaultTreeNode("mp3", new Document("Carlitos' Way", "24 GB", "Movie File"), pacino);
		
		TreeNode goodfellas = new DefaultTreeNode("mp3", new Document("Goodfellas", "23 GB", "Movie File"), deniro);
		TreeNode untouchables = new DefaultTreeNode("mp3", new Document("Untouchables", "17 GB", "Movie File"), deniro);
        
        return root;
    }
    
    public TreeNode createCheckboxDocuments() {
        TreeNode root = new CheckboxTreeNode(new Document("Files", "-", "Folder"), null);
		
		TreeNode documents = new CheckboxTreeNode(new Document("Documents", "-", "Folder"), root);
		TreeNode pictures = new CheckboxTreeNode(new Document("Pictures", "-", "Folder"), root);
		TreeNode movies = new CheckboxTreeNode(new Document("Movies", "-", "Folder"), root);
		
		TreeNode work = new CheckboxTreeNode(new Document("Work", "-", "Folder"), documents);
		TreeNode primefaces = new CheckboxTreeNode(new Document("PrimeFaces", "-", "Folder"), documents);
		
		//Documents
		TreeNode expenses = new CheckboxTreeNode("document", new Document("Expenses.doc", "30 KB", "Word Document"), work);
		TreeNode resume = new CheckboxTreeNode("document", new Document("Resume.doc", "10 KB", "Word Document"), work);
		TreeNode refdoc = new CheckboxTreeNode("document", new Document("RefDoc.pages", "40 KB", "Pages Document"), primefaces);
		
		//Pictures
		TreeNode barca = new CheckboxTreeNode("picture", new Document("barcelona.jpg", "30 KB", "JPEG Image"), pictures);
		TreeNode primelogo = new CheckboxTreeNode("picture", new Document("logo.jpg", "45 KB", "JPEG Image"), pictures);
		TreeNode optimus = new CheckboxTreeNode("picture", new Document("optimusprime.png", "96 KB", "PNG Image"), pictures);
		
		//Movies
		TreeNode pacino = new CheckboxTreeNode(new Document("Al Pacino", "-", "Folder"), movies);
		TreeNode deniro = new CheckboxTreeNode(new Document("Robert De Niro", "-", "Folder"), movies);
		
		TreeNode scarface = new CheckboxTreeNode("mp3", new Document("Scarface", "15 GB", "Movie File"), pacino);
		TreeNode carlitosWay = new CheckboxTreeNode("mp3", new Document("Carlitos' Way", "24 GB", "Movie File"), pacino);
		
		TreeNode goodfellas = new CheckboxTreeNode("mp3", new Document("Goodfellas", "23 GB", "Movie File"), deniro);
		TreeNode untouchables = new CheckboxTreeNode("mp3", new Document("Untouchables", "17 GB", "Movie File"), deniro);
        
        return root;
    }
}

TreeTable - ContextMenu

FREE THEMES

PREMIUM TEMPLATES