如何在 Tapestry5 中更新区域后设置焦点

Question

我有一个区域，其中包含一个包含循环的表单。当有人更改循环中的文本字段时，它会更新 onKeyUp 事件上的整个表单和循环。

我正在尝试找到一种方法来告诉 Tapestry 将焦点返回到上次更新的文本字段。我想我已经完成了这项工作，但是区域更新似乎使文本字段在设置焦点后立即失去焦点。我可以毫无问题地将焦点设置到区域之外的字段，因此似乎是区域更新导致了问题。

关于如何处理这个问题有什么建议吗？

Answer 1

听起来您需要在区域重新加载完成后设置焦点。每当我需要执行这样的任务时，我都会设置一个观察者来侦听 Javascript 中的 Tapestry 区域更新事件：

$('formZone').observe(Tapestry.ZONE_UPDATED_EVENT, function(event) {
    // set the focus
});   

希望这会有所帮助。

Answer 2

我知道这是一个旧线程，但我所做的是：

使用 jquery：

<t:zone t:id="formZone">
<t:form .... class="formId" t:zone="formZone>
.
.
</t:form>

jQuery.noConflict();
(function($) { 
  $(document).ready(function() {
      $(".formId").find("input, select").filter(function(){
          if($(this).val() == ""){           
             return true;
          }
        }).first().focus();

  });
})(jQuery);


</t:zone>

这将集中在第一个空输入或选择上。当然你的页面上必须包含jquery。 noConflict 确保您不会遇到原型问题。

Answer 3

Form 组件有一个 autofocus 参数默认为 true，导致一些 JavaScript 与表单一起呈现。表单加载后，JS 将焦点设置到第一个表单元素。

将 autofocus 设置为 false 会禁用此行为：

<form t:type="Form" t:autofocus="false">