XForms/選擇日期
< XForms
使用者經常希望選擇一個日期，而不是在欄位中鍵入日期。他們通常希望選擇一個日期，例如“下週二”，但他們可能需要使用日曆來查詢週二的日期。
幸運的是，大多數 XForms 實現都內建了日曆選擇器。
如果您有一個與日期型別繫結的欄位，表單將如下所示
這是一個使用日期選擇器的示例
<html
xmlns="http://www.w3.org/1999/xhtml"
xmlns:xf="http://www.w3.org/2002/xforms"
xmlns:ev="http://www.w3.org/2001/xml-events"
xmlns:xs="http://www.w3.org/2001/XMLSchema">
<head>
<title>Example using a date selector by binding an instance to an XML Schema date type</title>
<xf:model>
<xf:instance xmlns="">
<data>
<MyDate />
</data>
</xf:instance>
<xf:bind nodeset="MyDate" type="xs:date" />
</xf:model>
</head>
<body>
<p>Example of using the date selector by binding an instance to an XML Schema date type:
<br />
<xf:input ref="MyDate">
<xf:label>Enter a date: </xf:label>
</xf:input>
</p>
</body>
</html>
一個小的日曆圖示應該直接出現在輸入欄位的右側。點選日曆圖示並選擇一個日期。請注意，您可以使用日曆選擇器更改日期和月份。
關鍵行是
<xf:bind nodeset="MyDate" type="xs:date" />
請注意，如果您不使用 bind 命令，輸入將像普通文字欄位一樣工作。
輸入到日期欄位的格式為 YYYY-MM-DD，這是 XML 中用於日期的格式。您可以使用其他格式，例如 MM-DD-YYYY，但您必須使用 XPath 表示式來格式化欄位的外觀，並將外觀與模型中的值分開。
一旦繫結到型別“xs:date”，空字串（未設定日期）將不允許表單提交，沒有已知的直接解決方案，但是使用自定義繫結可以克服此問題
示例
<xf:input ref="Date" appearance="date" />
css
@namespace xf url(http://www.w3.org/2002/xforms);
@namespace mozType url(http://www.mozilla.org/projects/xforms/2005/type);
xf|input[appearance="date"] {
-moz-binding: url('chrome://xforms/content/input-xhtml.xml#xformswidget-input-date');
}
xf|input[appearance="date"] span[mozType|calendar] {
-moz-binding: url('chrome://xforms/content/widgets-xhtml.xml#calendar-full');
z-index: 2147481647;
}