1

我正在尝试根据验证决策来实现选择（并聚焦）组件。

例如：

  • 登录表单（2 个输入：用户名、密码；1 个提交按钮）
  • 如果验证失败username，<h:inputText id="name">将被关注
  • 如果验证失败password，<h:inputSecret id="password">将被关注
  • 页面不会刷新，提交是一个ajax按钮

我试过的：

没有ajax 调用（这工作正常-componentId在验证过程中的 bean 中设置，并在每次页面刷新/提交后选择/聚焦）：

$(document).ready(function() {
  document.getElementById('form:#{bean.componentId}').focus();
  document.getElementById('form:#{bean.componentId}').select();
});
...
<h:commandButton id="save" action="#{bean.save}" type="submit"/>

但是使用ajax调用：

function myFunc(data) {
  if (data.status == "success") {
    var element = document.getElementById('form:#{bean.componentId}');
    element.focus();
    element.select();
}}
...
<h:commandButton id="save" action="#{bean.save}" type="submit">
  <f:ajax execute="@form" render="@form" onevent="myFunc"/>
</h:commandButton>

这种方式也行得通，问题是，componentId仍然是一样的（在 bean 创建期间被初始化的那个）。

与此主题相关的先前问题：

如何使用 ajax 提交按钮并选择/聚焦到验证错误的字段？？？

4

1 回答 1

3

非 ajax 提交基本上重新呈现整个页面，包括脚本。ajax 提交仅重新呈现页面的一部分，在您的特定情况下仅是表单本身（由<f:ajax render>属性控制）。脚本显然没有放在表单中，因此它们保留了“旧”值（你知道，EL#{}在 webserver 中运行而不在 webbrowser 中运行，所以在 webbrowser 检索 HTML/JS 代码时，EL 已经运行时间长，调用JS代码时不会重新执行）。

您还需要将带有这些 EL 表达式的脚本块放在相同的形式中，以便它也将在 ajax 提交时更新。

于 2012-11-25T12:15:01.890 回答