在 JSF 中动态添加文本字段 [重复]

Posted 2023-02-23

【中文标题】在 JSF 中动态添加文本字段 [重复]

【英文标题】：Dynamic adding text fields in JSF [duplicate]

【发布时间】：2013-05-21 14:49:17

【问题描述】：

我有一个带有 inputText 的屏幕，旁边有一个 (+) 按钮，当用户按下该按钮时，表单应在其旁边（或下方，等等）添加另一个额外的 inputText

代码如下：

<table>
  <tr>
    <td>
      <p:inputText value="#controller.x" />
      <img src="../images/ico_plus.png" />
    </td>
  </tr>
</table>

在 Controller.java 中：

private String x;

public String getX()return x
public void setX(String val)x = val

我需要在页面中填充多个字段，并且控制器需要获取所有字段值

【参考方案1】：

这个问题被回答了不止一次，基本上你需要为 bean 中的所有字段保留一个List，然后用你的按钮删除或添加到这个List。请注意，在 ViewScoped 或 SessionScoped 中很重要，否则您的 List 将在每次操作时重置。

查看：

<h:form>
    <h:dataTable id="tblFields" value="#bean.fields" var="field">
        <h:column>
            <h:inputText value="#field.value" />
        </h:column>

        <h:column>
            <h:commandButton value="Remove">
                <f:ajax listener="#bean.onButtonRemoveFieldClick(field)" immediate="true" render="@form" /> 
            </h:commandButton>
        </h:column>
    </h:dataTable>

    <h:commandButton value="Add">
        <f:ajax listener="#bean.onButtonAddFieldClick" execute="@form" render="tblFields" /> 
    </h:commandButton>
</h:form>

助手类：

public class Field implements Serializable

    private String m_sName;

    public void setName(String p_sName)
    
        m_sName = p_sName;
    

    public String getName()
    
        return m_sName;
    

豆：

@ManagedBean
@ViewScoped
public class Bean implements Serializable

    private List<Field> m_lFields;

    public Bean()
    
        m_lFields = new ArrayList();

        m_lFields.add(new Field());
    

    public void setFields(List<Field> p_lFields)
    
        m_lFields = p_lFields;
    

    public List<Field> getFields()
    
        return m_lFields;
    

    public void onButtonRemoveFieldClick(final Field p_oField)
    
        m_lFields.remove(p_oField);
    

    public void onButtonAddFieldClick(AjaxBehaviorEvent p_oEvent)
    
        m_lFields.add(new Field());
    

【讨论】：

1+ 因为他的例子中有素面，所以这是相关的primefaces.org/showcase/ui/collector.jsf

@KarlKildén PrimeFaces 示例显示向表格动态添加内容，而不是向表格动态添加字段...

你是说你只能使用它们各自示例中显示的组件吗？还是这个特定展示柜中展示的组件无法解决他的功能需求？

@KarlKildén 不，h:inputText 可以替换为p:inputText，按钮也可以更改为p:commandButton，有或没有p:ajax，等等......但 PrimeFaces 示例没有OP 要求相同的功能。

再次，您是在谈论示例还是组件？不知道你为什么专注于谈论没有相关的组件。 是为处理列表而构建的组件。我不明白为什么它不起作用，欢迎您解释。请注意，我没有回答他的问题，我写了一条评论。