Primefaces 5 datascroller - 使用 Javascript 设置 scrollHeight答案

【问题标题】：Primefaces 5 datascroller - Setting scrollHeight with JavascriptPrimefaces 5 datascroller - 使用 Javascript 设置 scrollHeight
【发布时间】：2014-11-13 09:50:31
【问题描述】：

我正在使用 Primefaces 5 并且有一个 LazyLoaded 数据滚动条设置如下

<p:dataScroller value="#{controller.dataModel}" var="item" chunkSize="10" lazy="true" mode="inline" scrollHeight="100" id="scroller">
</p:dataScroller>

我希望将 dataScroller scrollHeight 设置为占据页面上我可以通过 JavaScript 获得的空间的全部高度，而不是固定大小 100。

我已经绑定了窗口调整大小的方法来重新计算大小并设置它，这可以工作，但我最初无法设置它。

设置它的javascript看起来像这样

$("#scroller > div").css("height", $("#main").height());

我在使用组件之后调用它

<h:outputScript>
    $("#scroller > div").css("height", $("#main").height());
</h:outputScript>

如前所述，如果我调整窗口大小但在最初呈现组件时无效。

【问题讨论】：

标签： javascript jquery jsf primefaces

【解决方案1】：

有两件事可能是错的。拥有id="scroller" 将不会呈现带有 id="scroller" 的组件，而是会预先添加一个组件 ID，例如id="form:scroller" 或类似 id="j_idt19:scroller" 的通用名称。所以可能是你的选择器不好。但是，如果它应用于调整大小，则可能是您与组件匹配得很好，在这种情况下，您的问题可能是由于组件已加载但尚未准备好引起的。无论哪种方式，以下都应该解决它

        <h:outputScript>
            $(function() {$(".ui-datascroller-content").css("height", "200px");});
        </h:outputScript>

如果您确定这不是问题，您可以更改选择器

【讨论】：

太好了，谢谢 - 在执行 javascript 之前组件没有准备好。这工作得很好:)