XForms 输入控件

La interfaz de usuario de XForms utiliza controles de XForms.

Controles de XForms

Los elementos de interfaz de usuario en XForms se denominan Controles de XForms。

Los elementos de control más comunes son <input> y <submit>.

Cada elemento de control tiene una propiedad ref que apunta al modelo de datos de XForms.

Controles independientes del dispositivo

Entender la interfaz de usuario de XForms no describe exactamente cómo se mostrarán los controles de XForms, lo que es muy importante.

Dado que XForms es independiente de la plataforma y el dispositivo, XForms deja la decisión de cómo mostrar estos espacios en manos del navegador.

Por lo tanto, XForms se puede utilizar en todos los tipos de dispositivos, computadoras personales, teléfonos móviles, computadoras portátiles, etc. XForms también es la solución perfecta para definir interfaces de usuario para personas con discapacidades.

Control de entrada

El control de entrada es el control más utilizado de XForms. Se utiliza para ingresar una línea de texto:

<input ref="name/fname">
<label>Nombre</label>
</input>

La mayoría de las veces, el control de entrada se muestra como un campo de entrada similar a este:

显示 input 控件

自己试试

Elemento <label>

El elemento <label> es un subelemento obligatorio de todos los controles de entrada de XForms.

La razón de esto es para asegurar que el formulario sea accesible para todos los tipos de dispositivos (ya que las etiquetas se pueden manejar de diferentes formas). Para los software de voz, las etiquetas se pueden leer, y para ciertos dispositivos portátiles, las etiquetas deben seguir paso a paso en la pantalla.

Control de secret

El control de secret es una variante especial del espacio de entrada, diseñado para ingresar contraseñas u otra información oculta:

<secret ref="name/password">
<label>Contraseña:</label>
</secret>

La mayoría de las veces, el control de secret se muestra como un campo de entrada de este tipo:

显示 Secret 控件

Control de textarea

El control de textarea se utiliza para entradas de múltiples líneas:

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

El control de textarea se puede mostrar como un campo de entrada de este tipo:

显示 Textarea 控件

Control de envío

El control de envío se utiliza para enviar datos:

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

Control de trigger

El control de trigger se utiliza para desencadenar una acción:

<trigger ref="calculate">
<label>¡Calcular!</label>
</trigger>

Control de salida:

El espacio de salida se utiliza para mostrar los datos de XForms:

<p>名字： <output ref="name/fname" /></p>
<p>姓氏：  <output ref="name/lname" /></p>

上面的例子仅能输出 XForms XML 文档（XForms 实例）中的 <fname> 和 <lname> 节点的内容：

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

显示如下：

名字：David
姓氏：Smith

自己试试

Upload 控件

upload 控件是为向服务器上传文件而设计的：

<upload bind="name">
<label>要上传的文件:</label>
<filename bind="file"/>
<mediatype bind="media"/>
</upload>