如何通过jquery或javascript生成panelgrid的点击事件？

Question

我正在使用JSF 2.0和primefaces 3.0。 我有一个rowtoggler和rowexpansion。 由于我使用的是primefaces旧版本，因此我没有rowToggle事件。 行扩展时，我需要通过ajax在服务器端调用方法。 所以我将div标签放在rowtoggler周围并调用javascript函数。 现在，我想通过rowexpansion内部的panelgrid的click事件来启动ajax调用。 如果发生这种情况，则它看起来像3.4 rowToggle事件。

Answer 1

单击行切换器时，可以使用jQuery的事件绑定执行Javascript。

<h:form id="form">
    <p:dataTable id="dt" value="[1,2]">
        <p:column>
            <p:rowToggler />
        </p:column>
    </p:dataTable>
    <p:remoteCommand name="remotecommand"
        oncomplete="alert('remote command fired')" />
</h:form>
<script type="text/javascript">
$("[id='form:dt'] .ui-row-toggler").on("click", function() { remotecommand(); });
</script>

JavaScript的说明：

$("[id='form:dt'] .ui-row-toggler")通过id（ form:dt ）选择数据form:dt ，然后选择所有具有ui-row-toggler样式类的后代。

.on("click", function() { remotecommand(); })将匿名函数绑定到click事件，该事件触发由p:remoteCommand声明的Javascript函数。

您可以使用p:remoteCommand的action或actionListener来执行bean方法。 ;-)

请注意，我认为这不是一个长期解决方案。 升级到PrimeFaces 3.4将是一个更好的解决方案。

Answer 2

我已经放置了commandLink arround rowtoggler，并且通过commandlink进行了ajax调用，我也可以使用EL2.2通过它传递值

<p:commandLink action="#{myBean.doSomething(foo)}" >
    <p:rowToggler/>
</p:commandLink>

Answer 3

我想你会喜欢

<p:panelGrid>
    <p:ajax event="click" listener="#{bean.onclick}" />
    ...
    the rest of the grid here
    ...
<p:panelGrid>

我尚未测试过，但它可用于其他组件

Answer 4

除了siebz0r的解决方案外，我还找到了另一种解决方案。

<p:commandLink action="#{bean.abcFunction}"> <p:rowToggler/> </p:commandLink>

它也可以工作，也很简单:-)