我创建了一个复合组件来扩展命令按钮并添加一些ajax函数(onBegin、onComplete和onSuccess)，但我有一些无法解决的问题:
当我单击按钮并发生验证错误时，即使表单再次呈现，成功事件函数也会传递 #{facesContext.validationFailed} = false 而不是 true ； (html 在调用成功事件之前渲染，对吧？)
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:cc="http://java.sun.com/jsf/composite"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core">
<cc:interface shortDescription="CommandButton com Ajax">
<cc:attribute name="onbegin"/>
<cc:attribute name="oncomplete"/>
<cc:attribute name="onsuccess"/>
<cc:attribute name="render"/>
<cc:attribute name="execute"/>
<cc:attribute name="action" targets="commandButton"/>
<cc:attribute name="actionListener" targets="commandButton"/>
<cc:attribute name="value"/>
<cc:attribute name="styleClass" targets="commandButton"/>
<cc:attribute name="immediate" targets="commandButton"/>
</cc:interface>
<cc:implementation>
<h:outputScript library="progutils" name="/js/commandButton.js" target="HEAD"/>
<h:commandButton id="commandButton" value="#{cc.attrs.value}">
<f:ajax render="#{cc.attrs.render}" execute="#{cc.attrs.execute}"
onevent="function(data){execCommandButtonAjax(data, function(){ #{cc.attrs.onbegin} },function(){ #{cc.attrs.oncomplete} },function(){ #{cc.attrs.onsuccess} }, #{facesContext.validationFailed})}">
</f:ajax>
</h:commandButton>
</cc:implementation>
</html>
Javascript 文件
function execCommandButtonAjax(data, onBegin, onComplete, onSuccess, validationFailed) {
var status = data.status;
switch (status) {
case 'begin': {
onBegin();
break;
}
case 'complete': {
onComplete();
break;
}
case 'success': {
console.log('Validation Failed ' + validationFailed);
if(!validationFailed){
onSuccess();
}
break;
}
}
}
使用组件:
<pu2:commandButton id="btnPu2"
onbegin="block(); console.log('begin')"
oncomplete="unblock(); console.log('complete')"
onsuccess="console.log('success')"
execute="@form"
action="#{list.search()}"
render="@form :table-form :form-pagination"
value="Do it">
</pu2:commandButton>
最佳答案
EL 表达式在生成 HTML 输出时进行计算。它们不会在 JavaScript 事件等期间进行评估。右键单击并查看源代码。你看，这就是 HTML/JS。没有 JSF 组件，没有 EL 表达式。 JSF“只是”一个 HTML 代码生成器。
因此，当您加载页面时，#{facesContext.validationFailed} 将打印 false。 正是这个值作为 JS 函数参数传递。仅当您在将其作为 JS 函数参数传递之前重新渲染负责打印 #{facesContext.validationFailed} 的 JSF 组件时，它才会起作用。
标准 JSF 不提供向 ajax 响应传递附加信息的工具。 PrimeFaces 和 OmniFaces 等组件库通过自定义 PartialViewContext 支持此功能。 PrimeFaces 的 args 对象中甚至还有一个内置的 validationFailed 属性，该属性可在任何 oncomplete 属性中使用。
最好的选择是有条件地渲染 onsuccess 脚本本身。
<h:commandButton id="commandButton" value="#{cc.attrs.value}">
<f:ajax execute="#{cc.attrs.execute}" render="#{cc.attrs.render} onsuccess"
onevent="function(data){execCommandButtonAjax(data, function(){ #{cc.attrs.onbegin} },function(){ #{cc.attrs.oncomplete} })}">
</f:ajax>
</h:commandButton>
<h:panelGroup id="onsuccess">
<h:outputScript rendered="#{facesContext.postback and not facesContext.validationFailed}">
#{cc.attrs.onsucces}
</h:outputScript>
</h:panelGroup>
关于javascript - 在 f :ajax "success" event only when validation has not failed 上执行脚本，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/30788402/