Date field (dojo) with popup to choose Day+Month+Year, Month+Year, Month or Year

<?xml version="1.0" encoding="UTF-8"?>

<xp:view xmlns:xp="http://www.ibm.com/xsp/core" xmlns:xc="http://www.ibm.com/xsp/custom"
	dojoParseOnLoad="true" dojoTheme="true" xmlns:xe="http://www.ibm.com/xsp/coreex">

	<xp:this.resources>
		<xp:styleSheet
			href="/.ibmxspres/dojoroot/dojox/widget/Calendar/Calendar.css" />
		<xp:dojoModule name="dijit.form.DateTextBox"></xp:dojoModule>
		<xp:dojoModule name="dojox.widget.CalendarViews"></xp:dojoModule>
	</xp:this.resources>

	<xp:table>
		<xp:tr>
			<xp:td>Day, Month and Year</xp:td>
			<xp:td>Month and Year</xp:td>
			<xp:td>Month</xp:td>
			<xp:td>Year</xp:td>
		</xp:tr>

		<xp:tr>
			<xp:td>
				<xp:inputText value="#{document.DayAndMonthAndYear}"
					id="date_DayAndMonthAndYear">
					<xp:dateTimeHelper id="dateTimeHelper_DayAndMonthAndYear"
						dojoType="dijit.form.DateTextBox">
						<xp:this.dojoAttributes>
							<xp:dojoAttribute name="popupClass"
								value="dojox.widget.Calendar3Pane">
							</xp:dojoAttribute>
						</xp:this.dojoAttributes>
					</xp:dateTimeHelper>
					<xp:this.converter>
						<xp:convertDateTime pattern="MMMM dd, yyyy">
						</xp:convertDateTime>
					</xp:this.converter>
				</xp:inputText>
			</xp:td>

			<xp:td>
				<xp:inputText value="#{document.MonthAndYear}" id="date_MonthAndYear">
					<xp:dateTimeHelper id="dateTimeHelper_MonthAndYear"
						dojoType="dijit.form.DateTextBox">
						<xp:this.dojoAttributes>
							<xp:dojoAttribute name="popupClass"
								value="dojox.widget.MonthAndYearlyCalendar">
							</xp:dojoAttribute>
						</xp:this.dojoAttributes>
					</xp:dateTimeHelper>
					<xp:this.converter>
						<xp:convertDateTime pattern="MMMM yyyy">
						</xp:convertDateTime>
					</xp:this.converter>
				</xp:inputText>
			</xp:td>

			<xp:td>
				<xp:inputText value="#{document.Month}" id="date_Month">
					<xp:dateTimeHelper id="dateTimeHelper_Month"
						dojoType="dijit.form.DateTextBox">
						<xp:this.dojoAttributes>
							<xp:dojoAttribute name="popupClass"
								value="dojox.widget.MonthlyCalendar">
							</xp:dojoAttribute>
						</xp:this.dojoAttributes>
					</xp:dateTimeHelper>
					<xp:this.converter>
						<xp:convertDateTime pattern="MMMM">
						</xp:convertDateTime>
					</xp:this.converter>
				</xp:inputText>
			</xp:td>

			<xp:td>
				<xp:inputText value="#{document.Year}" id="date_Year">
					<xp:dateTimeHelper id="dateTimeHelper_Year"
						dojoType="dijit.form.DateTextBox">
						<xp:this.dojoAttributes>
							<xp:dojoAttribute name="popupClass"
								value="dojox.widget.YearlyCalendar">
							</xp:dojoAttribute>
						</xp:this.dojoAttributes>
					</xp:dateTimeHelper>
					<xp:this.converter>
						<xp:convertDateTime pattern="yyyy">
						</xp:convertDateTime>
					</xp:this.converter>
				</xp:inputText>
			</xp:td>
		</xp:tr>
	</xp:table>

</xp:view>