Question

我们在项目中使用primefaces 5.1，在弹出日历窗口中选择日期后，在p：日历中，文本字段将失去焦点。由此引起的问题是你不能使用tab来关注表单中的下一个字段，它将转到表单中的第一个元素。即使是主要的展示也有这个问题： http://www.primefaces.org/showcase/ui/input/calendar.xhtml

关于如何解决它的任何建议？

Answer 1

经过一些搜索和本地测试，等待答案。我找到了解决这个问题的方法。它实际上是一个JQuery UI错误（或者可能不像第一个版本那样存在，但仍然没有正式修复！）。我们需要覆盖primefaces使用的jQueryUI datepicker。确保将该自定义脚本的导入放在最后一个方面，以便在最后一个订单中将其作为资源提取。

<f:facet name="last">
    <h:outputScript name="default/js/customDatePicker.js" />
</f:facet>

在JavaScript代码中，我执行以下操作将_selectDate合并到datepicker（更改位于最后的其他位置），这将超过原始_selectDate而不更改其他。它将在Chrome和IE11上为我提供帮助。

$(document).ready(function () {
    $.extend(jQuery.datepicker, {
        _selectDate: function (id, dateStr) {
            var onSelect,
                    target = $(id),
                    inst = this._getInst(target[0]);

            dateStr = (dateStr != null ? dateStr : this._formatDate(inst));
            if (inst.input) {
                inst.input.val(dateStr);
            }
            this._updateAlternate(inst);

            onSelect = this._get(inst, "onSelect");
            if (onSelect) {
                onSelect.apply((inst.input ? inst.input[0] : null), [dateStr, inst]);  // trigger custom callback
            } else if (inst.input) {
                inst.input.trigger("change"); // fire the change event
            }

            if (inst.inline) {
                this._updateDatepicker(inst);
            } else {
                this._hideDatepicker();
                inst.input.focus();
            }
        }
    });
});

选择日期后，Primefaces 5.1日历在文本字段中失去焦点

1 个答案: