0

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

问题

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

示例代码

<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 函数刷新内容。

更新1:

条件是:chartOne应该在其整个画布上提供点击(不仅是数据点或系列)。仅当dialogOne.show ()发生时才应呈现chartTwo 。

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

4

2 回答 2

1

使用动态对话框可能是一种解决方案。

从文档中:

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

只需像这样定义您的对话框:

<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()

于 2012-12-12T13:00:01.287 回答
0

尝试这个:

<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

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

于 2012-12-12T11:08:22.650 回答