Question

我想实现逻辑，当特定的Primefaces面板切换为打开或关闭时，该逻辑将更改数据表的scrollHeight。

到目前为止，我发现我可以使用javascript和PF(panelWidget)...或使用ajax事件处理程序来了解面板何时切换并对其做出反应，但无法正常工作它完全没有了。

以下是我正在使用的组件：

<h:form id="form">
  <p:panel id="toggleable" header="Toggleable" toggleable="true" widgetVar="panel">

        <p:ajax event="toggle" update="list" />
  </p:panel>

  <p:datatable id="list" scrollable="true" scrollHeight="toggle?300:100">

  </p:datatable>
</h:form>

Answer 1

我想将此作为评论发布，但时间太长了。这是我会尝试的：

<h:form id="form">

  <p:panel id="toggleable" header="Toggleable" toggleable="true" collapsed="true" widgetVar="panel">
    <p:ajax 
      event="toggle" 
      update="form:list" 
      oncomplete="$(document.getElementById('form:list')).find('.ui-datatable-scrollable-body').height(PF('panel').cfg.collapsed ? 100 : 300);" />
  </p:panel>

  <p:dataTable id="list" scrollable="true" scrollHeight="100">

  </p:dataTable>
</h:form>

正如您所见，oncomplete属性中的JS正在完成所有工作。 PF('panel').cfg.collapsed会检查面板是否折叠，我们会相应地设置.ui-datatable-scrollable-body高度。

我用PF 4.0进行了测试，它似乎对我有用。如果您不需要更新dataTable的内容，则可以删除update="form:list"并使用onstart代替oncomplete。

如何切换Primefaces面板时更新组件的属性

1 个答案: