如何在Primefaces对话框中对第一次输入禁用对焦

Question

我的页面中有一个对话框，其中包含一个输入字段(日期，日历)。问题是，日历在打开对话框后直接打开，因为焦点设置在第一个输入上。

是否有办法在Primefaces中禁用焦点?

Answer 1

您可以更改默认行为;

http://forum.primefaces.org/viewtopic.php?f=3& t = 29050

你总是可以覆盖小部件的默认行为，例如，防止日历关注对话框打开;

PrimeFaces.widget.Dialog.prototype.applyFocus = function() {
  var firstInput = this.jq.find(':not(:submit):not(:button):input:visible:enabled:first');
  if(!firstInput.hasClass('hasDatepicker')) {
      firstInput.focus();
  }
}

原代码为;

PrimeFaces.widget.Dialog.prototype.applyFocus = function() {
  this.jq.find(':not(:submit):not(:button):input:visible:enabled:first').focus();
}

如果你把你的override放在PrimeFaces资源之后，那么你的applyFocus实现将被拾取并使用。

我建议创建一个像primefaces-override .js这样的js文件，并把这样的东西放在里面，一个缺点是，因为你是针对低级api编码，你需要注意迁移期间的回归，尽管我们的目标是尽可能保持向后兼容性。

Answer 2

可以在默认情况下在另一个输入中设置焦点。

<p:dialog id="dialog" header="Users" focus="savebtn" widgetVar="txtName">

如果从另一个文件调用

<p:dialog id="dialog" header="Users" focus="savebtn" widgetVar="formRegUsers:txtName">

Answer 3

解决这个问题的另一个技巧:

我已经在我的对话框中添加了一个文本输入作为对话框的第一输入:

<p:dialog id="myDialogId" widgetVar="myDialog"....
  <p:inputText id="fixForFocusProblem"/>
  <p:calendar ...
  ..
</p:dialog>

当显示对话框时，我调用这个:

$('#myForm\:fixForFocusProblem').show();
myDialog.show(); 
$('#myForm\:fixForFocusProblem').hide();

这样，焦点就会集中在输入文本上，而输入文本会立即变得不可见。

Answer 4

<p:dialog onShow="$(document.activeElement).blur()" ...>

Or Primefaces jQuery

<p:dialog onShow="jQuery(document.activeElement).blur()" ...>

Answer 5

将此脚本添加到.xhtml中:

    PrimeFaces.widget.Dialog.prototype.applyFocus = function () {
        var firstInput = this.jq.find(':not(:submit):not(:button):input:visible:enabled:first');
        if (!firstInput.hasClass('hasDatepicker')) {
            firstInput.focus();
        }
    }

Answer 6

如果您正在使用日期picker，我建议这样使用:

<p:datePicker showOnFocus="false" showIcon="true" ... />