如何使用jsf.ajax.request在JSF中手动发送ajax请求

Question

我有一个表,每行都配置了'onclick'来调用js函数 - 这部分有效.我希望该函数向我可以以某种方式定义的方法发出ajax请求.返回时,应该呈现桌子下方的div.这可能吗？我用代码尝试了JS函数:

<h:outputScript library="javax.faces" name="jsf.js" />
...
function clickAndRender() {
  jsf.ajax.request(this, event, {render: 'div-to-render'})
}

但它当然不起作用.我不知道'source'参数的值(上面的代码使用'this')应该是什么,我也不知道应该在最后一个参数中设置什么执行.我也不知道如何定义要调用的url和'action'方法.

解决方案也可以在页面中的其他位置使用一些不可见的形式,通过点击提交.有人可以帮忙吗？

Answer 1

根据JSF 2.3,您可以使用<h:commandScript>它.另见规范问题613.

<h:form>
    <h:commandScript name="foo" action="#{bean.action}" render="div-to-render" />
</h:form>

function clickAndRender() {
    foo();
}

^{该问题在发布后3年内得到了更新.以下是原始答案,其中可以追溯到何时<h:commandScript>不存在.}

我不知道'source'参数的值(上面的代码使用'this')应该是什么

它应该是在客户端ID UICommand,你想调用组件,例如<h:commandLink>,<h:commandButton>通过标准API JSF提供等.这样,JSF将在应用请求值期间能够在组件树中找到所需组件,然后对在其上注册的所有操作(侦听器)进行排队.

我也不知道应该在最后一个参数中设置什么执行.

它应该是您在表单提交期间要处理的组件的空格分隔的客户端ID.它与您通常使用的完全相同<f:ajax execute>.

我也不知道如何定义要调用的url

只是当前页面,<form>它是由组件嵌套的<h:form>位置生成的UICommand.但是您不需要指定它jsf.ajax.request().该jsf.js会已确定其基础上的客户端ID UICommand组件.

和'行动'方法.

只需按常规方式指定目标组件的属性action或actionListener属性即可UICommand.

总而言之,您的具体问题可能是UICommand视图中没有任何组件,因此您无法使用jsf.ajax.request().一种方法是使用一个由CSS隐藏的命令组件的表单display:none:

<h:form id="foo" style="display:none">
    <h:commandLink id="bar" action="#{bean.method}" />
</h:form>

然后你可以foo:bar用作source参数.

jsf.ajax.request('foo:bar', null, {'javax.faces.behavior.event': 'action', 'execute': '@form', 'render': 'div-to-render'});

以上实际上与<f:ajax execute="@form" render="div-to-render">命令组件中的相同.您也可以选择此路径然后使用document.getElementById("foo:bar").click()而不是jsf.ajax.request().

或者,您也可以创建一个自定义UICommand组件,使JavaScript用户更容易一些.JSF实用程序库OmniFaces有这样一个组件,<o:commandScript>.另请参见其展示页面和源代码.JSF组件库PrimeFaces也有类似的组件<p:remoteCommand>.另请参见其展示页面.RichFaces也有<a4j:jsFunction>同样的做法.另请参见其展示页面.