Как реализовать динамический список с помощью составного компонента JSF 2.0? - PullRequest
Новая
       94

Как реализовать динамический список с помощью составного компонента JSF 2.0?

14 голосов
/ 15 июня 2011

Я задал этот вопрос, и хотя ответ напрямую удовлетворил мои потребности, у меня осталось ощущение, что для этой конкретной проблемы есть более простое решение.

Я хотел бы иметь составной компонент, который принимает список элементов (тип элементов, согласованных таким образом, что элементы могут свободно использоваться в составном компоненте)

CC (составной компонент) отображает список элементов и позволяет добавлять и вычитать элементы.

Я бы хотел сделать это наиболее простым и эффективным способом.

Чтобы проиллюстрировать проблему, пример:

enter image description here

Определение должно быть довольно простым (если, конечно, это не так :-)): 

<special:dynamicFieldList value="#{bean.fieldList} />

Наиболее абстрактной формой объекта Field будет: 

public class Field{
 String uuid;
 String value;
}

Полагаю, все. Как бы вы реализовали это простым способом?

Спасибо!

1 Ответ

24 голосов
/ 15 июня 2011

Я бы использовал <h:dataTable> в составном компоненте с поддержкой UIComponent, который можно связать с помощью атрибута componentType <composite:interface>. На основе UIComponent вы можете сохранить DataModel и определить действия.

dynamicFieldList.xhtml

<ui:composition
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:cc="http://java.sun.com/jsf/composite"
>
    <cc:interface componentType="dynamicFieldList">
        <cc:attribute name="value" type="java.util.List" required="true" />
    </cc:interface>
    <cc:implementation>
        <h:dataTable id="table" binding="#{cc.table}" value="#{cc.attrs.value}" var="field">
            <h:column><h:outputLabel value="#{field.label}" /></h:column>
            <h:column><h:inputText value="#{field.value}" /></h:column>
            <h:column><h:commandButton value="remove" action="#{cc.remove}" /></h:column>
        </h:dataTable>
        <h:commandButton value="add" action="#{cc.add}" />
    </cc:implementation>
</ui:composition>

(<h:inputText> может при необходимости быть составным компонентом поля)

com.example.DynamicFieldList

@FacesComponent(value="dynamicFieldList") // To be specified in componentType attribute.
@SuppressWarnings({"rawtypes", "unchecked"}) // We don't care about the actual model item type anyway.
public class DynamicFieldList extends UINamingContainer {

    private UIData table;

    public void add() {
        ((List) getAttributes().get("value")).add(new Field("somelabel"));
    }

    public void remove() {
        ((List) getAttributes().get("value")).remove(table.getRowData());
    }

    public UIData getTable() {
        return table;
    }

    public void setTable(UIData table) {
        this.table = table;
    }

}

Используйте его следующим образом: 

<h:form>
    <my:dynamicFieldList value="#{bean.fields}" />
</h:form>

только с этим 

@ManagedBean
@ViewScoped
public class Bean implements Serializable {

    private List<Field> fields;

    public Bean() {
        fields = new ArrayList<>();
    }

    public List<Field> getFields() {
        return fields;
    }

}

и 

public class Field implements Serializable {

    private String label;
    private String value;

    public Field() {
        //
    }

    public Field(String label) {
        this.label = label;
    }

    public String getLabel() {
        return label;
    }

    public void setLabel(String label) {
        this.label = label;
    }

    public String getValue() {
        return value;
    }

    public void setValue(String value) {
        this.value = value;
    }

}
...