我正在尝试在很长的表单上实现自动保存功能。
我在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返回的日志:
对于每个不能为空的输入都会重复这种情况。
好的,所以我终于想通了。我必须使用jQuery的. change()手动触发每个输入的onchange事件,以便ajax被执行并且JSF识别值的动态变化。
$(".form-control").each(function() {
$(this).change();
});
我相信这至少能为某人节省几个小时。