使用 jQuery 动态更改输入值不会影响 JSF 组件的 ajax onchange 事件

Question

我正在尝试在很长的表单上实现自动保存功能。

由于@NotNull javax 验证注释，我在 JSF 中有很多不能为 null 或空的 <h:inputText/>s 的表单。另外，我有一些<h:selectOneMenu>s 有

<f:ajax event="change" render="form-blueform-pnl_team" execute="form-blueform-pnl_team" listener="${improvementView.onTeamChange()}" />

动态更新一些其他<h:inputText/>s 值。

提交是这样的：

<h:commandButton action="${improvementView.save()}" styleClass="btn btn-primary ink-reaction marginleft5 hidden" id="save-blueform-btn">
    <f:ajax execute="@all" render="@all"/>
</h:commandButton>
<a href="#" id="form-blueform-save-blueform-btn-ui" class="btn btn-primary ink-reaction marginleft5">
    <i class="fa fa-save"></i> Save
</a>

jQuery 接收 #form-b​​lueform-save-blueform-b​​tn-ui 的点击事件并验证一些内容。一切正常后，它点击#form-b​​lueform-save-blueform-b​​tn。在此之前一切正常。

当我想用 $(#someinput).val("new value") 动态更改 JSF 输入的值时，问题就开始出现了。该值确实发生了完美的变化，但下拉列表的 ajax onchange 事件 - 例如 - 没有被执行。此外，如果我尝试提交表单，jQuery 验证会正常，但 JSF 验证会失败，说一切都为空。本质上，JSF 组件无法识别 jQuery 值的变化。

我已经为此苦苦挣扎了一段时间，找不到任何有用的东西。如果有人可以在这里指导我，我将不胜感激。

在这里你可以找到我的代码的更多sn-ps：

这就是我的<h:inputText>s 的样子

<h:inputText id="name" value="${improvementView.item.name}" styleClass="form-control" pt:required="required" />

这就是我的 jQuery 处理 #form-b​​lueform-save-blueform-b​​tn-ui 点击的方式：

$("#form-blueform-save-blueform-btn-ui").click(function(e) {
    var valid = $(".form-blueform")[0].checkValidity();
    if(valid) {
        $(".card-actionbar-row .btn").hide();
        $("#form-blueform-loading-submit").css({"display":"inline-block"});
        $("#form-blueform-save-blueform-btn").click();
        } else {
            $(".form-blueform")[0].reportValidity();
    }
    e.preventDefault();
});

这是Tomcat返回的日志：

警告：${improvementView.save()}：java.lang.IllegalArgumentException：无法解析参数号：interpolatedMessage='may not be null' javax.faces.FacesException: ${improvementView.save()}: java.lang.IllegalArgumentException: 无法解析参数号： interpolatedMessage='可能不为空' 在 com.sun.faces.application.ActionListenerImpl.processAction(ActionListenerImpl.java:118) 在 javax.faces.component.UICommand.broadcast(UICommand.java:315) 在 javax.faces.component.UIViewRoot.broadcastEvents(UIViewRoot.java:790) 在 javax.faces.component.UIViewRoot.processApplication(UIViewRoot.java:1282) 在 com.sun.faces.lifecycle.InvokeApplicationPhase.execute(InvokeApplicationPhase.java:81) 在 com.sun.faces.lifecycle.Phase.doPhase(Phase.java:101) 在 com.sun.faces.lifecycle.LifecycleImpl.execute(LifecycleImpl.java:198) 在 javax.faces.webapp.FacesServlet.service(FacesServlet.java:646) 在 org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:291) 在 org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:206) 在 org.apache.tomcat.websocket.server.WsFilter.doFilter(WsFilter.java:52) 在 org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:239) 在 org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:206) 在 com.madatait.ci.security.filters.AuthenticationFilter.doFilter(AuthenticationFilter.java:46) 在 org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:239) 在 org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:206) 在 org.apache.catalina.core.StandardWrapperValve.invoke（StandardWrapperValve.java:217） 在 org.apache.catalina.core.StandardContextValve.invoke（StandardContextValve.java:106） 在 org.apache.catalina.authenticator.AuthenticatorBase.invoke（AuthenticatorBase.java:502） 在 org.apache.catalina.core.StandardHostValve.invoke（StandardHostValve.java:142） 在 org.apache.catalina.valves.ErrorReportValve.invoke（ErrorReportValve.java:79） 在 org.apache.catalina.valves.AbstractAccessLogValve.invoke（AbstractAccessLogValve.java:616） 在 org.apache.catalina.core.StandardEngineValve.invoke（StandardEngineValve.java:88） 在 org.apache.catalina.connector.CoyoteAdapter.service（CoyoteAdapter.java:518） 在 org.apache.coyote.http11.AbstractHttp11Processor.process（AbstractHttp11Processor.java:1091） 在 org.apache.coyote.AbstractProtocol$AbstractConnectionHandler.process(AbstractProtocol.java:673) 在 org.apache.tomcat.util.net.NioEndpoint$SocketProcessor.doRun(NioEndpoint.java:1500) 在 org.apache.tomcat.util.net.NioEndpoint$SocketProcessor.run(NioEndpoint.java:1456) 在 java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1142) 在 java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:617) 在 org.apache.tomcat.util.threads.TaskThread$WrappingRunnable.run(TaskThread.java:61) 在 java.lang.Thread.run(Thread.java:745)

并且对于每个不能为空的输入重复。

Answer 1

好吧，我终于想通了。我必须使用 jQuery 的 .change() 手动触发每个输入的 onchange 事件，以便执行 ajax 并且 JSF 识别值的动态变化。

$(".form-control").each(function() { 
    $(this).change();
});

我相信这至少可以为某人节省几个小时。