在Jsf 2.0中无法使用Ajax渲染页面

Question

我面临一个非常奇怪的问题。 从我这边调试之后，我想在论坛上发布相同的问题。

问题：我有2个JSF数据表，分别是“ TableA”和“ TableB”。 我在TableB中有一些元素，现在我想根据条件移动一些文章，以移至TableA并在TableB中删除或不可见。

我能够在TableA中添加元素，并且可以看到当我打印TableB中存在的元素时，也已经通过调试器从TableB中删除了该元素，但是相同的更改未反映在UI上。

代码是：

<div id="selectedTableId" class="ArtSlected">
<h:dataTable id="selectedArtTable" value="#{articleBean.artList1}" var="sel" width="100%" border="0" cellspacing="0"
             cellpadding="0" columnClasses="center" class="TableStyle">
  <h:column>
    <h:commandButton id="deleteArticle" image="../resources/images/Delete.png" action="#{articleBean.deleteAction}">
      <f:setPropertyActionListener target="#{articleBean.articuloPromocionVO}" value="#{sel}"/>
      <f:ajax render=":articleSelectionForm:artDescTable selectedArtTable" execute="@form"/>
    </h:commandButton>
  </h:column>
  <h:column>
    <f:facet name="header">#{msgs.mpromo_article_selection_articles_selected}</f:facet>
    #{sel.articuloNombre} - #{sel.descripcion}
  </h:column>
</h:dataTable>
</div>

在此，articleSelectionForm是表单名称artDescTable引用TableA的形式，selectedArtTable引用TableB的形式。

我已经为<f:ajax>标记尝试了多种组合，但是没有任何效果。 例，

<f:ajax render=":articleSelectionForm:artDescTable selectedArtTable" execute="@form" />

<f:ajax render=":articleSelectionForm:artDescTable :articleSelectionForm:selectedArtTable" execute="@form" />

<f:ajax render=":articleSelectionForm:artDescTable :articleSelectionForm:selectedTableId:selectedArtTable" execute="@form" />

请告诉我我理解上的错误之处。

Answer 1

它必须引用组件的客户端ID。 对于初学者来说，确定正确的客户机ID的最简单方法是在浏览器中打开页面，右键单击并查看源，然后找到JSF组件的HTML表示形式。 看起来像这样

<table id="foo:bar:tableId" ...>

您需要精确地获取此值，并在其前面加上: 。

<f:ajax render=":foo:bar:tableId" ... />

如果它没有以默认前缀NamingContainer分隔符: NamingContainer ，则它将相对于当前NamingContainer父级解析。 这样的组件是<h:form> ， <h:dataTable> ， <ui:repeat> ，复合组件等。