Создание настраиваемых компонентов

Question

Я новичок в JSF. Мы создаем веб-приложение с использованием JSF с первичными. У нас много мест, где нам нужно отображать таблицу. Таблица должна содержать подкачку, изменить размер столбца, в некоторых местах нам нужно контекстное меню по правому щелчку и т. Д.

Я могу реализовать это с помощью компонента dataTable, созданного с помощью простых поверхностей. Но я хотел бы создать его как более настраиваемый компонент. Некоторые вещи, как многоразовый javascript/jquery (Jqgrid) плагин, где мы просто установили несколько значений свойств, которых должно быть должно быть достаточно.

Я хотел бы также сделать аналогичный путь вместо написания всего кода для всех функций, если создается компонент, который может быть повторно использован во всех местах и ​​задан параметр (например: columnResizable = 'true', columnSortable = «true»), что экономит время разработки.

Я не получаю картину того, как достигнуть этого. Если кто-то может это сделать, это будет здорово. Я не ожидаю полного кода, любая идея реализации этого с использованием JSF будет действительно оценена.

Answer 1

Вы должны использовать составной компонент, вы можете передать столько параметров, как вы хотите, и настроить его соответствующим образом с помощью #{cc.attrs.param1} синтаксиса. Вот пример XHTML.

Составной компонент

<ui:component xmlns="http://www.w3.org/1999/xhtml" xmlns:c="http://java.sun.com/jsp/jstl/core" xmlns:u="http://java.sun.com/jsf/composite/ui" xmlns:ui="http://java.sun.com/jsf/facelets" 
    xmlns:f="http://java.sun.com/jsf/core" xmlns:h="http://java.sun.com/jsf/html" xmlns:s="http://jboss.org/seam/faces" xmlns:p="http://primefaces.org/ui" xmlns:cc="http://java.sun.com/jsf/composite"> 
    <cc:interface> 
     <cc:attribute name="tableId" /> 
     <cc:attribute name="param1" /> 
     <cc:attribute name="param2" default="false" /> 
     <cc:attribute name="param3" required="true" /> 
    </cc:interface> 
    <cc:implementation> 
     <p:dataTable id="#{cc.attrs.tableId}" rendered="#{cc.attrs.param2}" value="#{cc.attrs.param1}" var="result" emptyMessage="#{messages['global.noItemsFound']}"> 
          <ui:include src="#{cc.attrs.param3}" /> 
     </p:dataTable> 
    </cc:implementation> 
</ui:component> 

Использование <c:if test="#{not empty cc.attrs.param4}"> или rendered атрибутов вы можете настроить ваш компонент

Вид

Давайте назовем ваш композитный myList.xhtml, то вы могли бы назвать его :

<u:myList param1="#{backingbean.results}" param2="true" id="list1" param3="/items/columns.xhtml" /> 

и не забудьте поставить заголовок на ваш взгляд:

xmlns:u="http://java.sun.com/jsf/composite/ui" 

columns.xhtml

<ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:s="http://jboss.org/seam/faces" xmlns:u="http://java.sun.com/jsf/composite/ui" 
    xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:f="http://java.sun.com/jsf/core" xmlns:h="http://java.sun.com/jsf/html" 
    xmlns:p="http://primefaces.org/ui"> 
    <p:column headerText="Name"> 
     <h:outputText value="#{result.name}" /> 
    </p:column> 
    <p:column headerText="Salary"> 
     <h:outputText value="#{result.salary}" /> 
    </p:column> 
    <p:column headerText="Age"> 
     <h:outputText value="#{result.age}" /> 
    </p:column> 
</ui:composition> 

Альтернативой включая отдельное представление для столбцов будет с помощью <p:columns> в составном компоненте и передать другой список, содержащий данные столбцов в качестве параметра. Dynamic Columns