[También se aplica a v8]{class="badge positive" title="También se aplica a Campaign v8"}

Editar formularios editing-forms

Información general

Los especialistas en marketing y los operadores utilizan formularios de entrada para crear, modificar y previsualizar registros. Forms muestra una representación visual de la información.

Puede crear y modificar formularios de entrada:

  • Puede modificar los formularios de entrada de fábrica que se envían de forma predeterminada. Los formularios de entrada de fábrica se basan en los esquemas de datos de fábrica.
  • Puede crear formularios de entrada personalizados basados en esquemas de datos definidos.

Forms son entidades del tipo xtk:form. Puede ver la estructura del formulario de entrada en el esquema xtk:form. Para ver este esquema, elija Administration > Configuration > Data schemas en el menú. Más información sobre estructura de formulario.

Para acceder a los formularios de entrada, elija Administration> Configuration >Input forms en el menú:

Para diseñar formularios, edite el contenido XML en el editor XML:

Más información.

Para obtener una vista previa de un formulario, haga clic en la ficha Preview:

Tipos de formularios

Puede crear diferentes tipos de formularios de entrada. El tipo de formulario determina cómo navegan los usuarios por el formulario:

  • Pantalla de consola

    Este es el tipo de formulario predeterminado. El formulario consta de una sola página.

  • Administración de contenido

    Utilice este tipo de formulario para la administración de contenido. Ver este caso de uso.

  • Ayudante

    Este formulario consta de varias pantallas flotantes ordenadas en una secuencia específica. Los usuarios navegan de una pantalla a otra. Más información.

  • Iconbox

    Este formulario consta de varias páginas. Para desplazarse por el formulario, los usuarios seleccionan iconos en la parte izquierda del formulario.

  • Notebook

    Este formulario consta de varias páginas. Para desplazarse por el formulario, los usuarios seleccionan pestañas en la parte superior del formulario.

  • Panel vertical

    Este formulario muestra un árbol de navegación.

  • Panel horizontal

    Este formulario muestra una lista de elementos.

Contenedores

En los formularios, puede utilizar contenedores para varios fines:

  • Organización del contenido de los formularios
  • Definición del acceso a los campos de entrada
  • Anidar formularios dentro de otros formularios

Más información.

Organizar contenido

Utilice contenedores para organizar el contenido de los formularios:

  • Puede agrupar los campos en secciones.
  • Puede agregar páginas a formularios de varias páginas.

Para insertar un contenedor, use el elemento <container>. Más información.

Agrupar campos

Utilice contenedores para agrupar los campos de entrada en secciones organizadas.

Para insertar una sección en un formulario, utilice este elemento: <container type="frame">. Opcionalmente, para agregar un título de sección, use el atributo label.

Sintaxis: <container type="frame" label="section_title"> […] </container>

En este ejemplo, un contenedor define la sección Creation, que comprende los campos de entrada Created by y Name:

<form _cs="Coupons (nms)" entitySchema="xtk:form" img="xtk:form.png" label="Coupons"
      name="coupon" namespace="nms" type="default" xtkschema="xtk:form">
  <input xpath="@code"/>
  <input xpath="@type"/>
  <container label="Creation" type="frame">
    <input xpath="createdBy"/>
    <input xpath="createdBy/@name"/>
  </container>
</form>

Agregar páginas a formularios de varias páginas

Para formularios de varias páginas, utilice un contenedor para crear una página de formulario.

Este ejemplo muestra contenedores para las páginas General y Detalles de un formulario:

<container img="ncm:book.png" label="General">
[…]
</container>
<container img="ncm:detail.png" label="Details">
[…]
</container>

Definición del acceso a los campos

Utilice contenedores para definir lo que está visible y para definir el acceso a los campos. Puede activar o desactivar grupos de campos.

Anidar formularios

Utilice contenedores para anidar formularios dentro de otros formularios. Más información.

Referencias a imágenes

Para buscar imágenes, elija Administration > Configuration > Images en el menú.

Para asociar una imagen con un elemento del formulario, por ejemplo, un icono, puede añadir una referencia a una imagen. Utilice el atributo img, por ejemplo, en el elemento <container>.

Sintaxis: img="namespace:filename.extension"

Este ejemplo muestra referencias a las imágenes book.png y detail.png del espacio de nombres ncm:

<container img="ncm:book.png" label="General">
[…]
</container>
<container img="ncm:detail.png" label="Details">
[…]
</container>

Estas imágenes se utilizan para iconos en los que los usuarios hacen clic para desplazarse por un formulario de varias páginas:

Creación de un formulario simple create-simple-form

Para crear un formulario, siga estos pasos:

  1. En el menú, elija Administration > Configuration > Input forms.

  2. Haga clic en el botón New en la parte superior derecha de la lista.

  3. Especifique las propiedades del formulario:

    • Especifique el nombre del formulario y el área de nombres.

      El nombre del formulario y el área de nombres pueden coincidir con el esquema de datos relacionado. Este ejemplo muestra un formulario para el esquema de datos cus:order:

      code language-xml
      <form entitySchema="xtk:form" img="xtk:form.png" label="Order" name="order" namespace="cus" type="iconbox" xtkschema="xtk:form">
        […]
      </form>
      

      También puede especificar explícitamente el esquema de datos en el atributo entity-schema.

      code language-xml
      <form entity-schema="cus:stockLine" entitySchema="xtk:form" img="xtk:form.png" label="Stock order" name="stockOrder" namespace="cus" xtkschema="xtk:form">
        […]
      </form>
      
    • Especifique la etiqueta que se mostrará en el formulario.

    • De forma opcional, especifique el tipo de formulario. Si no especifica un tipo de formulario, se utiliza el tipo de pantalla de la consola de forma predeterminada.

      Si está diseñando un formulario de varias páginas, puede omitir el tipo de formulario en el elemento <form> y especificar el tipo en un contenedor.

  4. Haga clic en Save.

  5. Inserte los elementos del formulario.

    Por ejemplo, para insertar un campo de entrada, utilice el elemento <input>. Establezca el atributo xpath en la referencia de campo como una expresión XPath. Más información.

    Este ejemplo muestra campos de entrada basados en el esquema nms:recipient.

    code language-xml
    <input xpath="@firstName"/>
    <input xpath="@lastName"/>
    
  6. Si el formulario se basa en un tipo de esquema específico, puede buscar los campos de este esquema:

    1. Haga clic en Insert > Document fields.

    2. Seleccione el campo y haga clic en OK.

  7. De forma opcional, especifique el editor de campos.

    Hay asociado un editor de campos predeterminado con cada tipo de datos:

    • Para un campo de tipo fecha, el formulario muestra un calendario de entrada.
    • Para un campo de tipo lista desglosada, el formulario muestra una lista de selección.

    Puede utilizar estos tipos de editor de campos:

    table 0-row-2 1-row-2 2-row-2 3-row-2
    Editor de campos Atributo de formulario
    Botón de opción type="radiobutton"
    Casilla de verificación type="checkbox"
    Editar árbol type="tree"

    Más información sobre controles de lista de memoria.

  8. De forma opcional, defina el acceso a los campos:

    table 0-row-3 1-row-3 2-row-3 3-row-3
    Elemento Atributo Descripción
    <input> read-only="true" Proporciona acceso de solo lectura a un campo
    <container> type="visibleGroup" visibleIf="edit-expr" Muestra condicionalmente un grupo de campos
    <container> type="enabledGroup" enabledIf="edit-expr" Habilita condicionalmente un grupo de campos

    Ejemplo:

    code language-xml
    <container type="enabledGroup" enabledIf="@gender=1">
      […]
    </container>
    <container type="enabledGroup" enabledIf="@gender=2">
      […]
    </container>
    
  9. De forma opcional, utilice contenedores para agrupar campos en secciones.

    code language-xml
    <container type="frame" label="Name">
       <input xpath="@firstName"/>
       <input xpath="@lastName"/>
    </container>
    <container type="frame" label="Contact details">
       <input xpath="@email"/>
       <input xpath="@phone"/>
    </container>
    

Creación de un formulario de varias páginas create-multipage-form

Puede crear formularios de varias páginas. También puede anidar formularios dentro de otros formularios.

Crear un formulario iconbox

Utilice el tipo de formulario iconbox para mostrar los iconos a la izquierda del formulario, que llevarán a los usuarios a diferentes páginas del formulario.

Para cambiar el tipo de un formulario existente a iconbox, siga estos pasos:

  1. Cambiar el atributo type del elemento <form> a iconbox:

    code language-xml
    <form […] type="iconbox">
    
  2. Establezca un contenedor para cada página de formulario:

    1. Agregue un elemento <container> como elemento secundario del elemento <form>.

    2. Para definir una etiqueta y una imagen para el icono, use los atributos label y img.

      code language-xml
      <form entitySchema="xtk:form" name="Service provider" namespace="nms" type="iconbox" xtkschema="xtk:form">
          <container img="xtk:properties.png" label="General">
              <input xpath="@label"/>
              <input xpath="@name"/>
              […]
          </container>
          <container img="nms:msgfolder.png" label="Details">
              <input xpath="@address"/>
              […]
          </container>
          <container img="nms:supplier.png" label="Services">
              […]
          </container>
      </form>
      

    Como alternativa, quite el atributo type="frame" de los elementos <container> existentes.

Crear un formulario de bloc de notas

Utilice el tipo de formulario notebook para mostrar las fichas en la parte superior del formulario, que llevan a los usuarios a diferentes páginas.

Para cambiar el tipo de un formulario existente a notebook, siga estos pasos:

  1. Cambiar el atributo type del elemento <form> a notebook:

    code language-xml
    <form […] type="notebook">
    
  2. Agregue un contenedor para cada página de formulario:

    1. Agregue un elemento <container> como elemento secundario del elemento <form>.
    2. Para definir la etiqueta y la imagen para el icono, utilice los atributos label y img.
    code language-xml
      <form entitySchema="xtk:form" name="Service provider" namespace="nms" type="notebook" xtkschema="xtk:form">
          <container label="General">
              <input xpath="@label"/>
              <input xpath="@name"/>
              […]
          </container>
          <container label="Details">
              <input xpath="@address"/>
              […]
          </container>
          <container label="Services">
              […]
          </container>
      </form>
    

    Como alternativa, quite el atributo type="frame" de los elementos <container> existentes.

Anidar formularios

Puede anidar formularios dentro de otros formularios. Por ejemplo, puede anidar formularios de bloc de notas en formularios de cuadro de iconos.

Nivel de anidación que controla la navegación. Los usuarios pueden explorar en profundidad los subformularios.

Para anidar un formulario dentro de otro formulario, inserte un elemento <container> y establezca el atributo type en el tipo de formulario. Para el formulario de nivel superior, puede establecer el tipo de formulario en un contenedor externo o en el elemento <form>.

Ejemplo

Este ejemplo muestra un formulario complejo:

  • El formulario de nivel superior es un formulario de cuadro de iconos. Este formulario consta de dos contenedores etiquetados como General y Detalles.

    Como resultado, el formulario externo muestra las páginas General y Detalles en el nivel superior. Para acceder a estas páginas, los usuarios hacen clic en los iconos de la izquierda del formulario.

  • El subformulario es un formulario de bloc de notas anidado en el contenedor General. El subformulario consta de dos contenedores con la etiqueta Name y Contact.

<form _cs="Profile (nms)" entitySchema="xtk:form" img="xtk:form.png" label="Profile" name="profile" namespace="nms" xtkschema="xtk:form">
  <container type="iconbox">
    <container img="ncm:general.png" label="General">
      <container type="notebook">
        <container label="Name">
          <input xpath="@firstName"/>
          <input xpath="@lastName"/>
        </container>
        <container label="Contact">
          <input xpath="@email"/>
        </container>
      </container>
    </container>
    <container img="ncm:detail.png" label="Details">
      <input xpath="@birthDate"/>
    </container>
  </container>
</form>

Como resultado, la página General del formulario externo muestra las fichas Nombre y Contacto.

Para anidar un formulario dentro de otro formulario, inserte un elemento <container> y establezca el atributo type en el tipo de formulario. Para el formulario de nivel superior, puede establecer el tipo de formulario en un contenedor externo o en el elemento <form>.

Ejemplo

Este ejemplo muestra un formulario complejo:

  • El formulario de nivel superior es un formulario de cuadro de iconos. Este formulario consta de dos contenedores etiquetados como General y Detalles.

    Como resultado, el formulario externo muestra las páginas General y Detalles en el nivel superior. Para acceder a estas páginas, los usuarios hacen clic en los iconos de la izquierda del formulario.

  • El subformulario es un formulario de bloc de notas anidado en el contenedor General. El subformulario consta de dos contenedores con la etiqueta Name y Contact.

<form _cs="Profile (nms)" entitySchema="xtk:form" img="xtk:form.png" label="Profile" name="profile" namespace="nms" xtkschema="xtk:form">
  <container type="iconbox">
    <container img="ncm:general.png" label="General">
      <container type="notebook">
        <container label="Name">
          <input xpath="@firstName"/>
          <input xpath="@lastName"/>
        </container>
        <container label="Contact">
          <input xpath="@email"/>
        </container>
      </container>
    </container>
    <container img="ncm:detail.png" label="Details">
      <input xpath="@birthDate"/>
    </container>
  </container>
</form>

Como resultado, la página General del formulario externo muestra las fichas Nombre y Contacto.

Modificación de un formulario de entrada de fábrica modify-factory-form

Para modificar un formulario de fábrica, siga estos pasos:

  1. Modifique el formulario de entrada de fábrica:

    1. En el menú, elija Administration > Configuration > Input forms.
    2. Seleccione un formulario de entrada y modifíquelo.

    Puede ampliar los esquemas de datos de fábrica, pero no puede ampliar los formularios de entrada de fábrica. Se recomienda modificar los formularios de entrada de fábrica directamente sin volver a crearlos. Durante las actualizaciones de software, las modificaciones realizadas en los formularios de entrada de fábrica se combinan con las actualizaciones. Si la combinación automática falla, puede resolver los conflictos. Más información.

    Por ejemplo, si amplía un esquema de fábrica con un campo adicional, puede añadir este campo al formulario de fábrica relacionado.

Validar formularios validate-forms

Puede incluir controles de validación en los formularios.

Conceder acceso de solo lectura a los campos

Para conceder acceso de sólo lectura a un campo, utilice el atributo readOnly="true". Por ejemplo, es posible que desee mostrar la clave principal de un registro, pero con acceso de sólo lectura. Más información.

En este ejemplo, la clave principal (iRecipientId) del esquema nms:recipient se muestra en el acceso de solo lectura:

<value xpath="@iRecipientId" readOnly="true"/>

Comprobar campos obligatorios

Puede comprobar la información obligatoria:

  • Utilice el atributo required="true" para los campos obligatorios.
  • Utilice el nodo <leave> para comprobar estos campos y mostrar mensajes de error.

En este ejemplo, la dirección de correo electrónico es obligatoria y se muestra un mensaje de error si el usuario no ha proporcionado esta información:

<input xpath="@email" required="true"/>
<leave>
  <check expr="@email!=''">
    <error>The email address is required.</error>
  </check>
</leave>

Obtenga más información sobre campos de expresión y contexto de formulario.

Validar valores

Puede utilizar llamadas a JavaScript SOAP para validar datos de formulario desde la consola de. Utilice estas llamadas para realizar validaciones complejas, por ejemplo, para comparar un valor con una lista de valores autorizados. Más información.

  1. Cree una función de validación en un archivo JS.

    Ejemplo:

    code language-js
    function nms_recipient_checkValue(value)
    {
      logInfo("checking value " + value)
      if (…)
      {
        logError("Value " + value + " is not valid")
      }
      return 1
    }
    

    En este ejemplo, la función se denomina checkValue. Esta función se usa para comprobar el tipo de datos recipient en el espacio de nombres nms. El valor que se está comprobando se registra. Si el valor no es válido, se registra un mensaje de error. Si el valor es válido, se devuelve el valor 1.

    Puede utilizar el valor devuelto para modificar el formulario.

  2. En el formulario, agregue el elemento <soapCall> al elemento <leave>.

    SOAP En este ejemplo, se usa una llamada de para validar la cadena @valueToCheck:

    code language-xml
    <form name="recipient" (…)>
    (…)
      <leave>
        <soapCall name="checkValue" service="nms:recipient">
          <param exprIn="@valueToCheck" type="string"/>
        </soapCall>
      </leave>
    </form>
    

    En este ejemplo, se utilizan el método checkValue y el servicio nms:recipient:

    • El servicio es el área de nombres y el tipo de datos.
    • El método es el nombre de la función. El nombre distingue entre mayúsculas y minúsculas.

    La llamada se realiza sincrónicamente.

    Se muestran todas las excepciones. Si utiliza el elemento <leave>, los usuarios no podrán guardar el formulario hasta que se valide la información introducida.

Este ejemplo muestra cómo puede realizar llamadas de servicio desde formularios:

<enter>
  <soapCall name="client" service="c4:ybClient">
    <param exprIn="@id" type="string"/>
    <param type="boolean" xpathOut="/tmp/@count"/>
  </soapCall>
</enter>

En este ejemplo, la entrada es un ID, que es una clave principal. SOAP Cuando los usuarios rellenan el formulario de este ID, se realiza una llamada a la cuenta de la aplicación con este ID como parámetro de entrada. El resultado es un booleano escrito en este campo: /tmp/@count. Puede utilizar este booleano dentro del formulario. Más información sobre contexto de formulario.

recommendation-more-help
601d79c3-e613-4db3-889a-ae959cd9e3e1