如何使用本地JavaScript在HTML DOM事件上调用JSF托pipebean?
我需要在HTML DOM load
事件中使用ajax执行一个JSF托pipebean操作方法,类似于jQuery的$(document).ready(function() { $.ajax(...) })
。 我只能在这个项目中使用由JSF生成的JavaScript。 有没有办法在本地JSF中做到这一点? 我可以使用哪个事件或者哪个JSF ajax函数可以使用?
我正在使用JSF 2.0,Facelets和PrimeFaces。
几种方法。
-
使用“隐藏forms”的伎俩(实际上,“黑客”是丑陋的措辞)。
<h:form id="form" style="display:none;"> <h:commandButton id="button" action="#{bean.action}"> <f:ajax render=":results" /> </h:commandButton> </h:form> <h:panelGroup id="results"> ... </h:panelGroup>
你可以在JS中调用它,如下所示:
document.getElementById("form:button").onclick();
注意在
<h:commandButton>
情况下触发onclick()
而不是click()
的重要性。onclick()
立即调用onclick
函数,而click()
只触发元素上的“click”事件,这在IE中不受支持。 如果您使用的是<h:commandLink>
,则可以安全地使用click()
。要在
load
事件中调用它,可以考虑把它放在<h:outputScript target="body">
。target="body"
自动将<script>
放在<body>
末尾,因此不需要$(document).ready()
包装器。<h:outputScript target="body"> document.getElementById("form:button").onclick(); </h:outputScript>
-
正如你已经使用PrimeFaces,只需使用它的
<p:remoteCommand>
。<h:form> <p:remoteCommand name="commandName" action="#{bean.action}" update=":results" /> </h:form> <h:panelGroup id="results"> ... </h:panelGroup>
你可以在JS中调用它,如下所示:
commandName();
然而,这不使用JSF原生
jsf.ajax.request()
,而是使用PrimeFaces原生jQuery(您知道,PrimeFaces是jQuery / UI之上的JSF组件库)。要在
load
事件中调用它,请设置autoRun="true"
。<p:remoteCommand ... autoRun="true" />
-
创build一个扩展
UICommand
的自定义UIComponent
,并生成必要的JSF原生jsf.ajax.request()
调用。 然后,您将重新创build<p:remoteCommand>
来使用本机JSF ajax而不是jQuery。 JSF实用程序库OmniFaces有一个<o:commandScript>
组件,它正是这样做的。 另请参阅展示和源代码 。<h:form> <o:commandScript name="commandName" action="#{bean.action}" render=":results" /> </h:form> <h:panelGroup id="results"> ... </h:panelGroup>
你可以在JS中调用它,如下所示:
commandName();
要在
load
事件中调用它,请设置autorun="true"
。<o:commandScript ... autorun="true" />
-
升级到JSF 2.3并使用本地的
<h:commandScript>
组件。 从2.3.0-m06开始可用。 语法与上面的<o:commandScript>
完全相同。 只需要将o:
replace成h: