当用户单击 primefaces 中的下一个箭头时递增到明年

Question

当用户单击日历中的下一个箭头按钮时，我正在尝试导航到明年。我正在努力实现这样的目标。 sample Image 双箭头会将年份值增加到明年。尽管 Naviagator 是 primefaces 中的一个选项，但我需要一种在小部件内使用键的方法，例如 richfaces 日历。所以我试图在用户单击日历中的下一个箭头时覆盖该事件，基本上我试图增加年份以及由 primefaces

完成的月份

我尝试使用 jquery:It 进行以下操作，每当用户单击按钮时都能正确收到警报，但我不知道如何增加小部件中的年份。应该如何处理？我应该从哪里开始？任何参考或链接都是高度 helpful.Thanks 提前

$(document).on('click', '.ui-datepicker-next', function () {
          alert('User clicked Next');
          //To do functionality
        });

Answer 1

是，结合使用 PrimeFaces 小部件和 JavaScript Date 的 setFullYear() 方法执行以下操作：

第 1 步。导航至 PF 日历展示页面：https://www.primefaces.org/showcase/ui/input/calendar.xhtml

第 2 步。在 Chrome 中按 F12 调出 Javascript 控制台。

第 3 步。在控制台中输入以下代码，然后按 ENTER 键，您将看到内联日历从 2019 年更改为 2020 年到 2021 年等。

var widget = PrimeFaces.widgets.widget_form_inline;
var nextYear = widget.getDate();
nextYear.setFullYear(nextYear.getFullYear() + 1);
widget.setDate(nextYear);

现在，如果您想使其通用，只需编写此 JS 方法并将每个日历中的 widgetVar 传递给它即可。

function incrementYear(widget) {
   var nextYear = widget.getDate();
   if (nextYear) {
      nextYear.setFullYear(nextYear.getFullYear() + 1);
      widget.setDate(nextYear);
   }
}

当用户单击 primefaces 中的下一个箭头时递增到明年

Incrementing to next year when user clicks next arrow in primefaces

jquery

jsf

jquery-ui

primefaces