JSF-<f:ajax> 无法呈现数据表</f:ajax>

Question

我有一个数据表，每行都有一个"delete"按钮，我想在删除该行的数据时重新渲染该表。

但我无法使f:ajax正常工作。

这是facelet页面上的数据表：

<h:form>
 <h:dataTable  value="#{adminPanelBean.activitiesList}" var="activityItem" id="allActivities"
                          styleClass="datatable" cellpadding="2" cellspacing="4"
                          columnClasses="ColName,colType,colTime,colPlace,colSummary" >
                <h:column>
                    <f:facet name="header">
                        <h:outputText value="Etkinlik"/>
                    </f:facet>
                    <h:outputText value="#{activityItem.name}  "/>

                </h:column>
                <h:column>
                    <f:facet name="header">
                        <h:outputText value="Türü"/>
                    </f:facet>
                    <h:outputText value="#{activityItem.type}"/>
                </h:column>
                <h:column>
                    <f:facet name="header">
                        <h:outputText value="Tarih "/>
                    </f:facet>
                    <h:outputText value="#{activityItem.time}"/>
                </h:column>
                <h:column>
                    <f:facet name="header">
                        <h:outputText value="Yer "/>
                    </f:facet>
                    <h:outputText value="#{activityItem.place}"/>
                </h:column>
                <h:column>
                    <f:facet name="header">
                        <h:outputText value="Açıklama "/>
                    </f:facet>
                    <h:outputText value="#{activityItem.summary}"/>
                </h:column>
                <h:column>
                    <f:facet name="header">
                        <h:outputText value="&nbsp;"/>
                    </f:facet>
            **<h:commandButton  value="Delete activity" onclick="if(confirm(' Delete #{activityItem.name} ?'))return true; else return false;"  action="#{adminPanelBean.deleteActivity(activityItem.id)}">&nbsp;
                    <f:ajax event="click" render="allActivities" execute="@all" immediate="true"/>
            <f:param name="activityId" value ="#{activityItem.id}"  />
               </h:commandButton>**
             </h:column>
            </h:dataTable>
        </h:form>

当我刷新页面时，我看到该行已被删除。 但我希望它是动态完成的。

Answer 1

在 action 方法中，您还需要从列表中删除该项目（因此不仅仅是从数据库中）。 我建议传递整个项目而不是仅传递 ID，以便您可以使用List#remove()方法。

action="#{adminPanelBean.deleteActivity(activityItem)}">

这样你就可以做到

public void deleteActivity(Activity activity) {
    activitiesList.remove(activity);
    // ...
}

---

与具体问题无关，他们使用confirm()的方式非常笨拙。

onclick="if(confirm(' Delete #{activityItem.name} ?'))return true; else return false;"

function 已经返回boolean 。 您无需在if中测试获得的 boolean 即可返回另一个boolean 。 只需将其简化如下：

onclick="return confirm('Delete #{activityItem.name}?')"