DataTable contendo inputText: é possível com JSF componente personalizado

votos
9

Eu sou novo para JSF e para a aplicação estou woriking sobre eu tenho que fazer um formulário de entrada campo múltipla.

Em poucas palavras, o usuário deve ter uma inputText quando ele insere seus dados e um botão que adiciona um novo texto de entrada, a fim de introduzir mais dados add. Quando o usuário é feito, ele empurra um outro botão enviar. Procurei algo já feito, mas eu não encontrei nada, então eu decidi criar meu próprio componente JSF personalizado

A ideia era criar um componente da combinação de uma dataTable contendo um inputText para cada linha da tabela de dados, além de um botão que adicionar uma linha para a coleção binded para a tabela de dados.

Eu estou olhando através da documentação jsf e livros, mas eu sou um pouco confuso e eu não tenho certeza se é possível a criação de um tal componente ... Alguém pode me ajudar? TIA

Publicado 10/12/2008 em 11:22
fonte usuário
Em outras línguas...                            


1 respostas

votos
12

É possível fazer tudo o que quiser.


Você pode construir algo próximo ao que você quer usando os controles existentes. Uma boa maneira de tirar o máximo proveito de JSF é adaptar o modelo para a vista. Por exemplo, essa visão exibe as opções de edição que permitem que você adicionar valores a uma tabela de dados.

<f:view>
    <h:form>
        <h:dataTable value="#{people.list}" var="row">
            <h:column>
                <f:facet name="header">
                    <h:outputText value="#" />
                </f:facet>
                <h:selectBooleanCheckbox value="#{row.selected}" />
            </h:column>
            <h:column>
                <f:facet name="header">
                    <h:outputText value="First Name" />
                </f:facet>
                <h:inputText value="#{row.firstname}" />
            </h:column>
            <h:column>
                <f:facet name="header">
                    <h:outputText value="Last Name" />
                </f:facet>
                <h:inputText value="#{row.lastname}" />
            </h:column>
            <f:facet name="footer">
                <h:panelGroup>
                    <h:commandButton value="Add Row" action="#{people.addPerson}" />
                    <h:commandButton value="Delete Selected"
                        action="#{people.deleteSelected}" />
                    <h:commandButton value="Finish" action="#{people.finish}" />
                </h:panelGroup>
            </f:facet>
        </h:dataTable>
    </h:form>
</f:view>

feijão Pessoas:

public class People implements Serializable {

    private static final long serialVersionUID = 1L;

    private List<Person> people = new ArrayList<Person>();

    public People() {
        // initialise with one entry
        people.add(new Person());
    }

    public List<Person> getList() {
        return people;
    }

    public String addPerson() {
        people.add(new Person());
        return null;
    }

    public String deleteSelected() {
        Iterator<Person> entries = people.iterator();
        while (entries.hasNext()) {
            Person person = entries.next();
            if (person.isSelected()) {
                entries.remove();
            }
        }
        return null;
    }

    public String finish() {
        System.out.println(people);
        return "someNavigationRule";
    }

}

Pessoa bean:

public class Person implements Serializable {

    private static final long serialVersionUID = 1L;

    private String firstname;
    private String lastname;
    private transient boolean selected = false;

    public String getFirstname() {
        return firstname;
    }

    public void setFirstname(String firstname) {
        this.firstname = firstname;
    }

    public String getLastname() {
        return lastname;
    }

    public void setLastname(String lastname) {
        this.lastname = lastname;
    }

    public boolean isSelected() {
        return selected;
    }

    public void setSelected(boolean selected) {
        this.selected = selected;
    }

}

faces-config.xml:

<managed-bean>
    <managed-bean-name>people</managed-bean-name>
    <managed-bean-class>addmultiple.People</managed-bean-class>
    <managed-bean-scope>session</managed-bean-scope>
</managed-bean>

Esta abordagem é bastante flexível e com alguma CSS, pode olhar muito bom. Com algumas mudanças para a vista e modelo, você pode ter apenas a última linha editável, por exemplo.


Se a experiência resultante não é rico o suficiente ou se precisar de algo que você pode reutilizar, você pode criar um controle personalizado. É difícil entrar em detalhes sem saber exatamente o que você quer, mas você provavelmente precisará de:

  1. Um novo renderizador para a emissão de pedidos de HTML e formulário de decodificação.
  2. (Talvez) um novo componente , provavelmente estendendo UIData , e uma forma concreta para expor específicas de RenderKit (por exemplo, HTML) atributos.
  3. Um novo JSP classe tag para permitir que o controle a ser utilizado em JSPs.
  4. Definições para todos os acima em um faces-config (ver especificação ).
Respondeu 10/12/2008 em 17:50
fonte usuário

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more