1

JSF-2.0、Mojarra 2.1.19、PrimeFaces 3.4.1

从我的上一篇可以看出。我正在使用的问题p:dataTable能够显示某种状态/评论模块。还有一个 JS/jQuery 函数可以编辑 dataTable 行的 CSS;

jQuery(document).ready(function() {
    var rowSize = '#{statusBean.size}';
    for (var i = 0; i < rowSize; i++) {
        var rowIndex = i;
        var inputTextStr = 'dataTableForm' + ':dataTable:' + rowIndex + ':commentInput';
        var inputText = $(document.getElementById(inputTextStr));
        inputText.css({'box-shadow':'0 0 5px #EB2F28'});
    }
});

并且p:dataTable是常规的liveScrolling=true,假设它有一个并且只有p:inputText一个具有通过上述功能修改的 CSS。

p:dataTable有很多行时会出现问题。假设用户向下滚动,live scroll表的事件被触发(ajax 请求)并且表加载更多行,但它加载p:inputText具有常规 CSS 的组件。函数不能将 css 应用到最近加载的行中。

因此,需要捕获该liveScroll事件或保证 JS 函数在每次更新时工作p:dataTable

4

1 回答 1

2

没有内置的 AJAX 事件可以处理这种情况,因此您必须自己完成。我会尽力给你一些建议。

首先通过为此创建函数重新组织您的 JavaScript,并在加载页面中调用该函数:

function applyMyCSS() {
    var rowSize = '#{statusBean.size}';
    for (var i = 0; i < rowSize; i++) {
        var rowIndex = i;
        var inputTextStr = 'dataTableForm' + ':dataTable:' + rowIndex + ':commentInput';
        var inputText = $(document.getElementById(inputTextStr));
        inputText.css({'box-shadow':'0 0 5px #EB2F28'});
    }
}

jQuery(document).ready(function() {
    applyMyCSS();
});

现在,您应该以某种方式在您的支持 bean 中处理这个 AJAX 请求。我调查了一下,发现当滚动发生时,会发送特定的参数yourDataTableId_scrolling,例如myForm:myTable_scrolling,这个参数的名称是true

在页面中的某个地方添加这个,最好在顶部的某个地方:

<f:metadata>
  <f:event type="preRenderView" listener="#{myBean.onPageLoad('clientIdOfComponent')}"/>
</f:metadata>

支持从页面中放置确切的客户 ID。您可以为此使用一些实用程序 PrimeFaces 函数,例如#{p:component('id')}获取客户端 ID。此事件将onPageLoad()在视图渲染之前和针对每个请求(AJAX 或非 AJAX)调用您的函数。在该函数中,您将过滤您的liveScroll事件并处理它:

public void onPageLoad(String datatableId) {
  FacesContext fc = FacesContext.getCurrentInstance();
  if (RequestContext.getCurrentInstance().isAjaxRequest() && 
          "true".equals(fc.getExternalContext().getRequestParameterMap().get(datatableId + "_scrolling")) {

    RequestContext.getCurrentInstance().execute("applyMyCSS()");
  }
}

请注意,这不是记录在案的行为,可以在未来的版本中更改(但我不希望这样)。我还创建了一个添加此功能的问题,也许很快就会添加。

于 2013-03-01T18:03:37.030 回答