我刚开始使用 Primefaces 程序。我想在 Datatable
中显示计时器。我想使用 setInterval
来显示“实时计时器”。我在属性 synopticBean.enteredTime
中得到了一个 Date 对象,我用它来开始计数。
但我不知道如何调用 JavaScript 函数来显示计时器。
<p:dataTable var="synopticBean" value="#{synopticLocationBean.synopticBeans}">
<p:column headerText="Family">
<h:outputText value="#{synopticBean.family}" />
</p:column>
<p:column headerText="id">
<h:outputText value="#{synopticBean.brNumber}" />
</p:column>
<p:column headerText="Target Time">
<h:outputText value="#{synopticBean.referenceTime}" />
</p:column>
<p:column headerText="Δ">
<h:outputText value="setInterval(function(){ alert("Hello"); }, 3000);" />
</p:column>
<p:column headerText="Elapsed Time">
<h:outputText value="#{synopticBean.enteredTime}" />
</p:column>
</p:dataTable>
我想要的结果是一个数据表,其中最后两列显示减少和增加的实时计时器:
我的数据可以通过 java bean 获得。 “已用时间”列获得一个 java 日期,例如“2019 年 1 月 21 日星期一 15:26:40 CET”。我不知道如何在列的每个单元格中显示实时计时器。如何将我的 java 日期设置为 setInterval
方法并在我不知道 html 的 id 的单元格中显示“结果”?
最佳答案
要将您上面的代码转换成一个工作示例,您可以这样做,
<p:dataTable var="synopticBean" value="#{synopticLocationBean.synopticBeans}">
<p:column headerText="Famille">
<h:outputText value="#{synopticBean.family}" />
</p:column>
<p:column headerText="BT">
<h:outputText value="#{synopticBean.brNumber}" />
</p:column>
<p:column headerText="Temps cible">
<h:outputText value="#{synopticBean.referenceTime}" />
</p:column>
<p:column headerText="Δ">
<script type="text/javascript">
//<![CDATA[
setInterval(function(){ console.log("Hello"); }, 3000);
//]]>
</script>
<!-- You can add any HTML code needed to display the chronometer here -->
</p:column>
<p:column headerText="Temps Accumulé">
<h:outputText value="#{synopticBean.enteredTime}" />
</p:column>
</p:dataTable>
如评论中所述,您不为此使用 h:outputText value
- 这是为了获取支持 bean 值。
另请注意,这将为 Δ
列中的每个单元格调用 setInterval
- 我想这就是您想要的。只需将 console.log
调用替换为更新您的计时器的调用,它就应该可以工作。
如旁注 - 可能更喜欢只用一个 setInterval
调用来更新所有计时表,而不是为 Δ
列中的每个单元格调用一个。最后取决于你想在这里完成什么。
关于javascript - 在 primefaces 数据表中显示计时器 setInterval,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54089125/