在JSF 2.0中动态创建输入字段并将其链接到支持Bean [英] Creating input fields dynamically in JSF 2.0 and linking it to a backing bean

问题描述

我的要求是这样的.在JSF(2.0)页面中，我有一个称为地址"的部分.我添加了一个按钮，上面写着添加地址".当用户单击按钮时，应动态生成新的地址字段(输入文本)(Line1，Line2，City等).然后，当我单击提交"时，所有值(地址1，地址2 ...地址N)都应进入数组列表.

My requirement is something like this. In a JSF(2.0) page, I have a section called Address. I have added a button which says "Add an Address". When the user clicks the button, new address fields(input text) should be generated dynamically (Line1, Line2, City etc..,). And when I click submit, all the values (Address 1, Address 2 ... Address N) should go to an array list.

所以我需要

1. 单击按钮即可动态生成UI组件
2. 将这些UI组件链接到支持bean(最好是列表)
3. 数据表不应用于以上

1. Dynamically generate UI components on click on a button
2. Link those UI components to a backing bean (Preferably to a list)
3. Data tables should not be used for the above

很难在网上找到合适的JSF文档，所以如果有人可以帮助我，那将是很好的

It is very difficult to find proper JSF documentations online, so if anyone can help me out it would be great

更新:没有人发布的答案很好，但是我想要更强大的功能，例如从Java Controller(使用HtmlPanelGrid组件的Java bean)创建动态UI组件.我已经能够使用htmlPanelGrid动态创建组件，但是我无法找到一种方法将这些生成的组件绑定到bean中的地址列表(存储所有地址详细信息的地址)

Update : The answer posted by noone works good, but I want something more robust, like creating dynamic UI components from the Java Controller (The java bean, using HtmlPanelGrid component). I have been able to create components dynamically using htmlPanelGrid, but I cannot find a way to bind those generated components to the address list in the bean (The one which stores details of all the addresses)

推荐答案

我假定您为地址使用了类Address.还有AddressBean和List来保持地址.

I assume that you have a class Address for the addresses. And a AddressBean with a List to keep the adresses.

代码可能看起来像这样(对于我能想到的最基本的情况):

The code might look like this (for the most basic scenario I can think of):

<h:form id="addressForm">
    <h:commandButton value="Add Address" action="#{addressBean.addAddress()}" immediate="true" execute="@this">
        <f:ajax render="addressForm" />
    </h:commandButton>
    <c:forEach items="#{addressBean.addressList}" var="address">
        <h:inputText value="#{address.street}" /><br />
    </c:forEach>
    <h:commandButton value="Save" action="#{addressBean.persistAddresses}" />
</h:form>

---

@ManagedBean
@ViewScoped
public class AddressBean {
    private List<Address> addressList = new ArrayList<Address>(); // getter+setter

    public void addAddress() {
        addressList.add(new Address());
    }

    public void persistAddresses() {
        // store the addressList filled with addresses
    }
}

---

public class Address {
    private String address; // getter+setter
}

<c:forEach>来自JSTL.它可能与<ui:repeat>一起使用，但是根据您的实际情况，可能不起作用.

<c:forEach> is taken from the JSTL. It might work with <ui:repeat>, but depending on your actual scenario it might not.

这篇关于在JSF 2.0中动态创建输入字段并将其链接到支持Bean的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！