![](/img/trans.png)
[英]click event for <p:outputLabel> with <p:ajax> inside <p:datatable>
[英]JSF and p:ajax inside p:dataTable inside ui:repeat
我熟悉RichFaces,但对于Primefaces来说相对较新,并尝试在p:dataTable
(另外在ui:repeat
内部)中实现简单的h:graphicImage
。 这是h:graphicImage中p:ajax的后续问题。
我将拆分以下xhtml
-code以直接注释行为:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.prime.com.tr/ui"
xml:lang="en" lang="en">
<h:head id="head">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Test</title>
</h:head>
<h:body id="body">
<f:view contentType="text/html">
现在,第一个h:form
随之出现,其中包含一个h:outputText
和一个h:graphicImage
。 通过单击图像,将调用bean方法,并且计数器已正确更新。
<h:form id="f1">
<h:outputText id="counter" value="#{clientBean.counter}" />
<h:graphicImage url="/images/circle-ok.png">
<p:ajax event="click" update="counter" process="@this"
listener="#{clientBean.tag}"/>
</h:graphicImage>
</h:form><hr/>
在第二个h:form
,按钮位于p:dataTable
内部。 如果单击图像,则称为bean方法的计数器被更新。 ( 请注意,在尝试时,我尝试update="counter"
失败)
<h:form id="f2">
<p:dataTable var="var" value="#{clientBean.vf}">
<p:column>
<f:facet name="header">Tag</f:facet>
<h:graphicImage url="/images/circle-ok.png">
<p:ajax event="click" update="f1:counter" process="@this"
listener="#{clientBean.tag}" />
</h:graphicImage>
</p:column>
</p:dataTable>
</h:form><hr/>
ui:repeated
的图像将按预期更新计数器 :
<ui:repeat var="var1" value="#{clientBean.list}">
<h:form id="f3">
<h:graphicImage url="/images/circle-ok.png">
<p:ajax event="click" update="f1:counter" process="@this"
listener="#{clientBean.tag}" />
</h:graphicImage>
现在让我们进入ui:repeat
内部的p:dataTable
。 使用这段代码, 不会调用bean方法:
<p:dataTable var="var2" value="#{var1.list}">
<p:column>
<f:facet name="header">Tag</f:facet>
<h:graphicImage url="/images/circle-ok.png">
<p:ajax event="click" update="f1:counter" process="@this"
listener="#{clientBean.tag}" />
</h:graphicImage>
</p:column>
</p:dataTable>
</h:form>
</ui:repeat>
</f:view></h:body></html>
在这种情况下,我得到了<partial-response><changes><update id="f1:counter">...
,但是未调用bean方法(在它的tag()
方法内部, 计数器未更新)。 这是通过调试进行测试的。 我已经读过无法在我的primeface的数据表上使用<p:ajax>,但是我与primefaces-3.0.M3.jar
和primefaces-2.2.1.jar
具有相同primefaces-2.2.1.jar
。
我曾经有过类似的问题。 我可能UIData
偏执,但我的印象是UIRepeat
中的迭代组件UIData
和UIRepeat
出错了。 特别是当它们嵌套时,它们将无法正确处理组件状态。 我已经修补了UIRepeat
我自己,它适用于任何嵌套级别。 我知道战斧的迭代组件也可以正常工作。
在您的特定情况下,一个合理的简单解决方法可能会有所帮助,因为无论单击哪个图像,您都想要相同的行为。 创建一个h:commandLink
形式的h:commandLink
,其中包含适当的ajax元素,其ID为'update-counter'。 把它藏起来。 将onclick属性添加到您的graphicImage中,其值为jsf.ajax.request("f1:update-counter", event, {render: "f1:counter", execute="@this"})
。 我不确定,您可能需要将第一个参数替换为document.getElementById("f1:update-counter")
。 此javascript api调用应等效于单击隐藏的commandLink。 或者,您可以尝试跳过commandLink并从f1传递graphicImage id / DOM节点。
我曾经用f:ajax
做到这一点,但也许也可以用于p:ajax
。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.