我需要在 HTML DOM load
事件期间使用 ajax 执行 JSF 托管 bean 操作方法,类似于 jQuery 的 $(document).ready(function() { $.ajax(. ..) })
。我只能在这个项目中使用 JSF 生成的 JavaScript。有没有办法在原生 JSF 中做到这一点?我可以使用哪个事件或可以使用哪个 JSF ajax 函数?
我正在使用 JSF 2.0、Facelets 和 PrimeFaces。
最佳答案
几种方式。
使用
<h:commandScript>
.请注意,这仅在 JSF 2.3 之后可用。<h:form> <h:commandScript name="commandName" action="#{bean.action}" render=":results" /> </h:form> <h:panelGroup id="results"> ... </h:panelGroup>
您可以在 JS 中调用它,如下所示:
commandName();
可以按如下方式传递参数:
commandName({ name1: "value1", name2: "value2" });
得到如下:
String name1 = externalContext.getRequestParameterMap().get("name1"); // value1 String name2 = externalContext.getRequestParameterMap().get("name2"); // value2
在
load
期间调用它事件,设置autorun="true"
.<h:commandScript ... autorun="true" />
如果您使用 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 组件库)。可以按如下方式传递参数:
commandName([{ name: "name1", value: "value1" }, { name: "name2", value: "value2" }]);
得到如下:
String name1 = externalContext.getRequestParameterMap().get("name1"); // value1 String name2 = externalContext.getRequestParameterMap().get("name2"); // value2
在
load
期间调用它事件,设置autoRun="true"
.<p:remoteCommand ... autoRun="true" />
如果您使用的是 OmniFaces,请使用其
<o:commandScript>
.用法与<h:commandScript>
完全相同但随后可用于旧的 JSF 2.x 版本。只需替换
h:
通过o:
在第一个例子中。历史记录:<h:commandScript>
完全基于<o:commandScript>
.使用“隐藏形式”技巧(实际上,“hack”是丑陋的更好的措辞)。
<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();
注意触发
onclick()
的重要性而不是click()
如果是<h:commandButton>
.onclick()
立即调用onclick
click()
时的功能只触发元素的“点击”事件,IE不支持。如果您使用的是<h:commandLink>
, 你可以安全地使用click()
相反。可以通过
<h:inputHidden>
传递参数与您事先通过 JS 填写的表格相同。这在 How to pass JavaScript variables as parameters to JSF action method? 中得到了证明。在
load
期间调用它事件,考虑将其放入<h:outputScript target="body">
.target="body"
自动放入<script>
在<body>
结束时,因此$(document).ready()
包装器是不必要的。<h:outputScript target="body"> document.getElementById("form:button").onclick(); </h:outputScript>
或者,创建自定义
UIComponent
延伸UICommand
并生成必要的 JSF nativejsf.ajax.request()
称呼。例如,您可以查看 source code OmniFaces<o:commandScript>
.
关于javascript - 如何使用 native JavaScript 在 HTML DOM 事件上调用 JSF 托管 bean?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16588327/