Kontrol Input XForms

Antarmuka pengguna XForms menggunakan kontrol XForms.

Kontrol XForms

Elemen antarmuka pengguna di XForms disebut Kontrol XForms

Elemen kontrol yang paling sering digunakan adalah <input> dan <submit>.

每个控件元素均有 ref 属性指回 XForms 的数据模型。

独立于设备的控件

理解 XForms 用户界面并不会确切地描述如何显示 XForms 控件是很重要。

由于 XForms 是独立于平台和设备的,XForms 把如何显示这些空间的权利留给了浏览器。

正因如此,XForms 可被用于所有类型的设备,个人电脑,移动电话、手持计算机等等。XForms 同时也是为残障人士定义用户界面的完美解决方案。

input 控件

input 控件是最常用的 XForms 控件。它用于输入一行文本:

<input ref="name/fname">
<label>First Name</label>
</input>

大多数时候,input 控件会被显示为类似这样的输入域:

Tampilan Kontrol Input

Coba sendiri

<label> 元素

<label> 元素是所有 XForms 输入控件的强制子元素。

这一点的原因是为了确保表单可用于所有类型的设备(因为标签可通过不同的方式来处理。)对于语音软件,标签可被读出,而对于某些手持设备,标签必须一屏接一屏的跟随输入。

Secret 控件

Secret 控件是 input 空间的特殊变体,被设计用于输入密码或其他隐藏的信息:

<secret ref="name/password">
<label>Password:</label>
</secret>

大多数时候,secret 控件会显示为这样一个输入域:

Tampilan Kontrol Secret

Textarea 控件

Textarea 控件用于多行的输入:

<textarea ref="message">
<label>Message</label>
</textarea>

textarea 控件可显示为这样的输入域:

Tampilan KontrolTextarea

Submit 控件

Submit 控件用于提交数据:

<submit submission="form1">
<label>Submit</label>
</submit>

Trigger 控件

trigger 控件用于触发某个动作:

<trigger ref="calculate">
<label>Calculate!</label>
</trigger>

Output 控件:

Output 空间用于显示 XForms 数据:

<p>Nama Depan: <output ref="name/fname" /></p>
<p>Nama Terakhir:  <output ref="name/lname" /></p>

Contoh di atas hanya dapat menampilkan konten node <fname> dan <lname> dalam dokumen XML XForms (实例) di atas:

<instance>
  <person>
    <name>
      <fname>David</fname>
      <lname>Smith</lname>
    </name>
  </person>
</instance>

Tampil seperti ini:

Nama Depan: David
Nama Terakhir: Smith

Coba sendiri

Kontrol Upload

Kontrol upload dirancang untuk mengunggah file ke server:

<upload bind="name">
<label>File untuk diunggah:</label>
<filename bind="file"/>
<mediatype bind="media"/>
</upload>