Fork me on GitHub
Attention: This component is still under progress and experimental.
b:treeBox The treeBox tag renders a HTML input element of the type "text" using Trivial Components TreeComboBox to customize rendered view. No longer use of selectitems nor converter to render a combobox - just a list of objects (and in case of a tree of nodes).
Tag attributes
HTML5 tag attributes
Tag controls
  • default Childs will rendered with default template as nodes.
  • custom Use custom template for nodes rendering. See facet in showcase.
Change it and see JSF example.
Adds f:ajax as child to component.

Change it and see JSF example.
component
tooltip
submit Submit the above component.
-
-
 
                            <!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml" 
      xmlns:h="http://xmlns.jcp.org/jsf/html" 
      xmlns:f="http://xmlns.jcp.org/jsf/core" 
      xmlns:b="http://butterfaces.org/components"> 
<h:head /> 
<body>
    <h:form id="formId">
        <b:treeBox id="input"
                   label="label"
                   hideLabel="false"
                   value="#{myBean.selectedValue}"
                   values="#{myBean.values}"
                   placeholder="Enter text..."
                   readonly="false"
                   disabled="false"
                   inputTextProperty="null"
                   required="false"
                   autoFocus="false"
                   showClearButton="true"
                   rendered="true">
            <b:tooltip>
                tooltip
            </b:tooltip>
        </b:treeBox>
    </h:form> 
</body> 
</html>
                        
                            package org.butterfaces.treeBox.demo;

import import org.butterfaces.model.tree.Node;
import import org.butterfaces.model.tree.DefaultNodeImpl;
import import javax.faces.view.ViewScoped;
import import javax.inject.Named;

@ViewScoped
@Named
public class MyBean implements Serializable {

    private Node rootNode;

    private Node selectedValue;

    public Node getValues() {
        if (rootNode == null) {
            final Node firstChild = new DefaultNodeImpl("firstChild");
            firstChild.setDescription("23 unread");
            firstChild.setImageIcon("some/path/16.png");
            final Node secondChild = new DefaultNodeImpl("second");
            secondChild.setImageIcon("some/path/16.png");
            secondChild.getSubNodes().add(new DefaultNodeImpl("..."))
            ...
            rootNode = new DefaultNodeImpl("rootNode");
            rootNode.setImageIcon("some/path/16.png");
            rootNode.getSubNodes().add(firstChild);
            rootNode.getSubNodes().add(secondChild);
        }
        return rootNode;
    }

    // GETTER + SETTER (selectedValue)

}
                        
                            <?xml version="1.0" encoding="UTF-8"?> 
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee" 
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 
         xsi:schemaLocation="http://java.sun.com/xml/ns/javaee 
                             http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd" 
         version="3.0"> 

  <!-- Text showing if no entry is found -->
  <!-- Could be overridden by noEnttriesText component attribute -->
  <!-- default is 'No matching entries...' -->
  <context-param>
     <param-name>org.butterfaces.noEntriesText</param-name>
     <param-value>No matching entries...</param-value>
  </context-param>

  <!-- Text showing if entries are loading -->
  <!-- Could be overridden by spinnerText component attribute -->
  <!-- default is 'Fetching data...' -->
  <context-param>
     <param-name>org.butterfaces.spinnerText</param-name>
     <param-value>Fetching data...</param-value>
  </context-param>

  <!-- If true, it shows 'x'-button to delete the selected entry. -->
  <!-- Could be overridden by showClearButton component attribute -->
  <!-- default is true -->
  <context-param>
     <param-name>org.butterfaces.treebox.showClearButton</param-name>
     <param-value>true</param-value>
  </context-param>

</web-app>