将源 HTML 元素传递给 PrimeFaces p:ajax 的完整功能答案

【问题标题】：Pass source HTML element to oncomplete function of PrimeFaces p:ajax将源 HTML 元素传递给 PrimeFaces p:ajax 的完整功能
【发布时间】：2016-04-19 05:29:09
【问题描述】：

我想将源 HTML 元素作为参数传递给 <p:ajax oncomplete> 的 JavaScript 回调函数。我尝试传递this，它通常在onclick 等中工作：

<p:ajax ... oncomplete="callbackFunction(this)" />

它不工作。它似乎是一个不同的对象。

我怎样才能做到这一点？

【问题讨论】：

如果封闭组件是一个小部件，则将小部件传递给 javascript 函数。如
你在哪个组件中使用了这个 ajax 行为？
@SubodhJoshi h:commandLink
@EvaMariam thx 但这不起作用...

标签： javascript ajax jsf-2 primefaces

【解决方案1】：

在oncomplete 的上下文中，this 表示实际上包含大量信息的 PrimeFaces ajax 对象。您可以通过在调试器中检查对象或传递给自动漂亮地打印 JS 对象的 console.log 来轻松找出它。

function callbackFunction(arg) {
    console.log(arg);
}

万一……

<h:form id="formId">
    <h:commandLink id="linkId" value="test">
        <p:ajax oncomplete="callbackFunction(this)" />
    </h:commandLink>
</h:form>

.. 它在控制台中看起来像这样（按 F12 到达那里）：

accepts: Object
async: true
beforeSend: (w,i)
cache: false
complete: (w,i)
contentType: "application/x-www-form-urlencoded; charset=UTF-8"
contents: Object
converters: Object
crossDomain: false
data: "javax.faces.partial.ajax=true&javax.faces.source=formId%3AlinkId&javax.faces.partial.execute=formId%3AlinkId&javax.faces.behavior.event=action&javax.faces.partial.event=click&formId=formId&javax.faces.ViewState=-4870787666399983047%3A-2006040112896840046"
dataType: "xml"
dataTypes: Array[2]
error: (x,i,w)
flatOptions: Object
global: false
hasContent: true
isLocal: false
jsonp: "callback"
jsonpCallback: ()
portletForms: null
processData: true
responseFields: Object
source: a#formId:linkId
success: (x,i,y)
type: "POST"
url: "/playground/test"
xhr: bD()
__proto__: Object

如果您仔细观察，source 属性就是您最终需要的。

因此，只需相应地更改您的呼叫：

<p:ajax ... oncomplete="callbackFunction(this.source)" />

【讨论】：