如何使用 AJAX 单击命令按钮在 JSF 中呈现数据表

Posted 2023-02-22

【中文标题】如何使用 AJAX 单击命令按钮在 JSF 中呈现数据表

【英文标题】：How to render a datatable in JSF with AJAX clicking a commandButton

【发布时间】：2021-03-17 12:02:04

【问题描述】：

目标是拥有一个h:commandButton，一旦我点击它，使用 AJAX 它将显示数据表“listaActores”（最初不显示它）。

我怎么能这样做？我已经寻找解决方案，但我只找到了如何在表格出现时重新渲染表格。我当前的代码什么都不做就显示表格，点击按钮什么也不做。

<h:form>
    <h:commandButton id="submit" value="Submit">
        <f:ajax event="click" execute="@this" render="listaActores" />
    </h:commandButton>
    <h:dataTable id="listaActores" border="1"
        value="#peliculasEditarBean.listaActores" var="actor">
        <h:column>
            <f:facet name="header">NOMBRE</f:facet>
            #actor.nombre
        </h:column>
        <h:column>
            <f:facet name="header">APELLIDO</f:facet>
            #actor.apellido
        </h:column>
    </h:dataTable>
</h:form>

【参考方案1】：

你的问题有些不完整，但我还是会回答。两件事：

您并不是说表格“最初没有显示”。如果上面有一些rendered，那么您需要知道您必须呈现表的父级。您只能渲染呈现的 html 中存在的内容。例如，请参见 answer。

如果您将action 放在按钮中，您会发现 AJAX 不起作用。您需要将事件更改为action 或删除此属性以使用默认值。

我准备了简单的工作示例（顺便说一句。欢迎使用 *** :-) 如果您想更快地获得帮助 Minimal, Reproducible Example 应该是您的问题的一部分 :-)）：

（XHTML，将action 添加到commandButton 并删除f:ajax 中的event）

<h:form>
    <h:commandButton id="submit" value="Submit"
        action="#peliculasEditarBean.initialize">
        <f:ajax execute="@this" render="listaActores" />
    </h:commandButton>
    <h:dataTable id="listaActores" border="1"
        value="#peliculasEditarBean.listaActores" var="actor">
        <h:column>
            <f:facet name="header">NOMBRE</f:facet>
                #actor.nombre
            </h:column>
        <h:column>
            <f:facet name="header">APELLIDO</f:facet>
                #actor.apellido
            </h:column>
    </h:dataTable>
</h:form>

（和豆子）

@ManagedBean
@ViewScoped
public class PeliculasEditarBean implements Serializable 

    private List<Actor> listaActores = null;

    public List<Actor> getListaActores() 
        return listaActores;
    

    public void initialize() 
        listaActores = new ArrayList<>(3);
        listaActores.add(new Actor("foo", "bar"));
        listaActores.add(new Actor("foo", "foo"));
        listaActores.add(new Actor("bar", "bar"));
    
    
    public class Actor 
        private final String nombre;
        private final String apellido;

        Actor(String nombre, String apellido) 
            this.nombre = nombre;
            this.apellido = apellido;
        

        public String getApellido() 
            return apellido;
        

        public String getNombre() 
            return nombre;