Question

在处理primefaces图表时我遇到了问题。

问题

当我点击lineChart时，会出现一个包含另一个折线图的对话框。

示例代码

<p:lineChart id="chartOne" rendered="cond1"/>

<p:dialog widgetVar="dialogOne">
     <p:lineChart id="chartTwo" rendered="cond1"/>
</p:dialog>

<script>
   $('#chartOne').bind('jqplotClick',
        function (ev, seriesIndex, pointIndex, data) {
            dialogOne.show();
        }
   );
</script>

现在我可以在图表点击上显示对话框，但对话框内的图表并不令人耳目一新。我对通过JavaScript函数刷新内容了解不多。

UPDATE1：

条件是： chartOne 应该在整个画布上提供点击（不仅是数据点或系列）。只有在 dialogOne.show（）发生时才应呈现 chartTwo 。

任何帮助......非常感谢

Answer 1

这可能是使用动态对话框的解决方案。

来自文档：

动态模式允许对话框在显示之前获取内容而不是页面加载，这对减少初始页面加载时间很有用。默认为false。

只需像这样定义对话框：

<p:dialog widgetVar="dialogOne" dynamic="true">

<强>更新

要从Javascript刷新对话框，您可以使用p:remoteCommand。例如：

<h:form id="formId">
    <p:dialog id="dialog" />
</h:form>
<p:remoteCommand name="updateDialog" update=":formId:dialog"/>

第二次更新：

使用Javascript中的p:remoteCommand来电updateDialog()。

Answer 2

试试这个：

<p:lineChart id="chartOne" rendered="cond1" >
    <p:ajax event="itemSelect" listener="#{bean.action}" update="chartTwo" oncomplete="dialogOne.show()" />
</p:lineChart>

<p:dialog widgetVar="dialogOne">
     <p:lineChart id="chartTwo" rendered="cond1"/>
</p:dialog>

在您的支持bean的方法action()上，您应该准备chartTwo的数据。

根据用户手册，图表的可点击部分将是系列，而不是整个图表。检查

http://www.primefaces.org/showcase-labs/ui/interactiveCharts.jsf

了解更多信息和工作示例。

通过JavaScript函数刷新对话框内的内容

2 个答案: