XForms/自定义控件
< XForms
通常，复杂的表单需要超出 W3C XForm 标准提供的基本功能。好消息是，XForms 被设计得易于扩展。这个过程称为创建自定义控件。
创建 XForms 自定义控件有几个原因
- 自定义呈现 - 由您的 XForms 处理器呈现的 XForms 控件无法为您表单提供正确的呈现
- 自定义数据类型和日期类型到 UI 的映射 - 现有的 XForms 控件无法与您的数据类型正常工作（例如，将布尔值绑定到复选框）
- 高级 XForms 控件 - 您需要自定义控件来扩展基本 XForms 控件的功能
- 新宿主语言 - 您希望在宿主语言中支持 XForms
以下示例使用名为 XML 绑定（XML Bindings）的技术来创建一个新控件。当选择 select1 列表时，此控件将显示不同的图像。
<html
xmlns="http://www.w3.org/1999/xhtml"
xmlns:xf="http://www.w3.org/2002/xforms">
<head>
<title>Custom Image Control Sample</title>
<bindings id="xformsBindings" xmlns="http://www.mozilla.org/xbl" xmlns:html="http://www.w3.org/1999/xhtml">
<binding id="output-image" extends="chrome://xforms/content/xforms.xml#xformswidget-base">
<content>
<html:div>
<html:img anonid="content" />
</html:div>
</content>
<implementation implements="nsIXFormsUIWidget">
<method name="refresh">
<body>
<!--
set the src attribute on the html:img to be the simpleContent
of the instance node bound to this control
-->
var img = document.getAnonymousElementByAttribute(this, "anonid", "content");
img.setAttribute("src", this.stringValue);
return true;
</body>
</method>
</implementation>
</binding>
</bindings>
<xf:model>
<xf:instance xmlns="">
<data>
<curimg />
<img label="Firefox">http://www.mozilla.org/foundation/identity-guidelines/firefox-128.png</img>
<img label="Thunderbird">http://www.mozilla.org/foundation/identity-guidelines/thunderbird-128.png</img>
<img label="Bugzilla">http://www.mozilla.org/images/p-bugz.gif</img>
<img label="Mozilla">http://www.mozilla.org/images/mozhead-80x64.gif</img>
</data>
</xf:instance>
</xf:model>
<style type="text/css">
@namespace xf url(http://www.w3.org/2002/xforms);
xf|output[mediatype="image/*"] {
-moz-binding: url('#output-image');
}
</style>
</head>
<body>
<h1>Custom Control Sample</h1>
<xf:select1 ref="curimg">
<xf:label>Select image to display: </xf:label>
<xf:itemset nodeset="../img">
<xf:label ref="@label" />
<xf:value ref="." />
</xf:itemset>
</xf:select1>
<xf:output ref="curimg" mediatype="image/*" />
</body>
</html>
此示例使用 xbl:binding 结构、几行 JavaScript 代码和 CSS 文件中的绑定。请注意，此示例仅在 FireFox 中有效，因为 XML 绑定目前不是 XForms 规范的一部分。
请注意，XML 绑定语言 (xbl) 目前是 w3C 的工作草案。参见 XBL 工作草案。当 XBL 成为建议时，这些示例可能更有可能在 XForms 的多个实现中运行。现在我们需要使用实现特定的标签。
此示例程序由 Allan Beaufour 于 2005 年 7 月发布在 FireFox XForms 文档网站上：XForms 自定义控件