0

由于我们可以将 JQuery 应用于任何 JSF 渲染的组件,如以下问题所示

JSF 到 JQuery 组件集成

在尝试过之后,它确实有效,我可以成功地将 JQuery 集成到 JSF 中,但问题是每当我重新渲染 h:dataTable 时,JQuery 停止工作,顺便说一下,我正在使用 RichFaces 和 a4j -。

比如我有一个数据表如下

<h:dataTable id="someDataTable" value="#{backingBean.someDataModel}" var="item" styleClass="table">
   <h:column>
      <h:outputText value="#{item.text}"/>
   </h:column>
</h:dataTable>

我有一个按钮,单击该按钮会重新呈现数据表,并用新数据重新填充它。

<a4j:commandButton value="Click" reRender="someDataTable"/>

不要忘记我在页面中有这个脚本

<script>
  jQuery.noConflict();
   jQuery(document).ready(function () {
      jQuery('.table').dataTable({
    "bSort": false}); 
    });
</script>

现在,当第一次加载页面时,排序工作正常,但是每当我单击按钮重新渲染表格时,表格都会成功地填充来自支持 bean 的新数据,但排序不再起作用。

从我的猜测来看,我认为这可能与

jQuery(document).ready()

这适用于

jQuery.('.table').dataTable(); 

只有当文档准备好时,所以我想知道 jQuery 中是否有一些事件可以附加到 dataTable 重新渲染事件,因为我不是 JQuery 或 JS 的专家。

4

1 回答 1

1

只需在 ajax 请求完成后重新执行脚本即可。

首先将您的脚本重构为可重用的函数。

<script>
    jQuery.noConflict();
    jQuery(document).ready(function() {
        initDataTable();
    });
    function initDataTable() {
        jQuery('.table').dataTable({
            "bSort": false
        }); 
    }
</script>

oncomplete然后在of 中调用相同的函数<a4j:commandButton>

<a4j:commandButton ... oncomplete="initDataTable()" />
于 2012-05-15T13:20:01.647 回答