提问者:小点点

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


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

我在JSF中有这个表单,里面有很多

更新其他一些<代码>

提交是这样的:

<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-Blueform-save-Blueform-btn-用户界面的点击事件并验证一些东西。一切正常后,它单击#form-Blueform-save-Blueform-btn。在这一点之前,一切都很好。

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

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

在这里您可以找到我的更多代码片段:

这就是我的<代码>

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

这就是我的jQuery如何处理#form-Blueform-save-Blueform-btn-用户界面点击:

$("#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返回的日志:

对于每个不能为空的输入都会重复这种情况。


共1个答案

匿名用户

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

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

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