PrimeFaces calendar例子 _PrimeFaces组件

本文概述

日历属性
结构样式类
例子

它是用于选择日期的输入组件。 < p：calendar> 组件用于在JSF应用程序中创建日历。它包括各种功能, 例如：显示模式, 分页, 本地化, ajax选择等。
日历的值应为java.util.Date。
日历属性下表包含” 日历” 组件的属性。

Attribute	Default value	Return type	Description
id	null	String	它是组件的唯一标识符。
rendered	true	Boolean	它需要布尔值来指定组件的呈现。
value	null	java.util.Date	用于设置组件的值。
converter	null	Converter/String	它采用为组件定义转换器的表达式或文字文本。
required	false	Boolean	用于根据需要制作组件。
mindate	false	日期或字符串	它用于设置日历的最小可见日期。
maxdate	null	日期或字符串	它用于设置日历的最大可见日期。
pages	1	Integer	它支持多页渲染。
mode	popup	String	它用于定义日历的显示方式。
pattern	MM/dd/yyyy	String	它用于设置DateFormat模式进行本地化。
timeZone	null	Time Zone	它用于指定用于日期转换的时区。
showWeek	false	Boolean	用于显示每个星期旁边的星期数。
disabledWeekends	false	Boolean	它禁用周末专栏。
showOtherMonths	false	Boolean	它显示属于其他月份的日期。
selectOtherMonths	false	Boolean	它可以选择属于其他月份的日期。
yearRange	null	String	用于设置年份范围。
timeOnly	false	Boolean	它仅显示不带日期的时间选择器。

结构样式类下表包含结构样式类。

样式类	Applies
.ui-datepicker	用于主容器。
.ui-datepicker-header	用于标头容器。
.ui-datepicker-上一个	用于上个月的导航器。
.ui-datepicker-next	用于下个月的导航器。
.ui-datepicker-title	它用于标题。
.ui-datepicker-month	用于月份显示。
.ui-datepicker-table	它用于日期表。
.ui-datepicker-week-end	此类用于标记周末。
.ui-datepicker-other-month	属于其他月份的日期的类。
.ui-datepicker td	它用于每个单元格日期。
.ui-datepicker-buttonpane	这是按钮面板类。
.ui-datepicker-current	此类用于” 今天” 按钮。
.ui-datepicker-关闭	用于显示关闭按钮。

例子在下面的示例中, 我们正在实现< p：calendar> 组件。本示例包含以下文件。
JSF文件
// calendar.xhtml

< ?xml version='1.0' encoding='UTF-8' ?> < !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> < html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://xmlns.jcp.org/jsf/html" xmlns:p="http://primefaces.org/ui"> < h:head> < title> Calendar Example< /title> < /h:head> < h:body> < h:panelGrid columns="2" cellpadding="5"> < p:outputLabel for="inline" value="http://www.srcmini.com/Select Date" /> < p:calendar id="inline" value="http://www.srcmini.com/#{calendar.date}" mode="popup" /> < /h:panelGrid> < /h:body> < /html>

ManagedBean
// Calendar.java

package com.srcmini; import java.text.SimpleDateFormat; import java.util.Date; import javax.faces.application.FacesMessage; import javax.faces.bean.ManagedBean; import javax.faces.context.FacesContext; import org.primefaces.context.RequestContext; import org.primefaces.event.SelectEvent; @ManagedBean public class Calendar { private Date date; public void onDateSelect(SelectEvent event) { FacesContext facesContext = FacesContext.getCurrentInstance(); SimpleDateFormat format = new SimpleDateFormat("dd/MM/yyyy"); facesContext.addMessage(null, new FacesMessage(FacesMessage.SEVERITY_INFO, "Date Selected", format.format(event.getObject()))); } public void click() { RequestContext requestContext = RequestContext.getCurrentInstance(); requestContext.update("form:display"); requestContext.execute("PF('dlg').show()"); } public Date getDate() { return date; } public void setDate(Date date) { this.date = date; } }

【PrimeFaces calendar例子】运行JSF文件后, 它将产生以下输出。
输出