Form designer

El diseñador es un editor visual, basado en SurveyJS Creator, donde se definen los campos del formulario. Para abrirlo, pulse el icono Design del listado de formularios (o el botón Design de los detalles del formulario).

La barra superior muestra el nombre del formulario. Pulse la flecha para volver al listado de formularios. El editor tiene las siguientes pestañas:

Pestaña	Descripción
Designer	Arrastre los campos desde la caja de herramientas de la izquierda (texto, texto largo, desplegable, casillas, botones de opción, fecha, sí/no, subida de ficheros…) y defina sus propiedades en el panel derecho.
Preview	Muestra el formulario tal como lo verán los usuarios.
Themes	Personaliza el aspecto del formulario.
Logic	Define condiciones, como mostrar u ocultar campos.
JSON Editor	Muestra la definición del formulario en JSON.

Los cambios se guardan automáticamente.

Idioma

En las propiedades General del formulario, Select a survey language establece el idioma del formulario.

Formulario simple o asistente

Un formulario con una sola página se muestra como un formulario simple. Si añade más páginas, el usuario navega entre ellas con los botones Previous y Next, como en un asistente.

Asociar campos a metadatos de OpenKM

Los campos del formulario se asocian a los metadatos de la plantilla. El Name de cada campo debe coincidir con el nombre del metadato de OpenKM (por ejemplo okp:group.field), de modo que el valor enviado se guarde en ese metadato.

Para obtener los nombres correctos, use los selectores de la barra superior:

1. Seleccione un Property group de los asignados a la plantilla.
2. Seleccione un Form element de ese grupo.
3. Pulse Copy field name y péguelo en la propiedad Name del campo del formulario.

Valores de los desplegables

Para los desplegables definidos en OpenKM, las opciones se pueden cargar directamente desde OpenKM, de modo que siempre son las definidas en el grupo de propiedades. Por ejemplo, esta es la definición de un desplegable en un grupo de propiedades:

<select label="Language" name="okp:tpl.language" type="simple">
  <option label="Java" value="java"/>
  <option label="Python" value="python"/>
  <option label="PHP" value="php" />
</select>

Smart Forms expone las opciones de cualquier campo desplegable en:

http://localhost:8080/smart-forms/rest/okm/fields/options?field=okp%3Atpl.language

El parámetro field es el nombre del campo de metadatos (okp:tpl.language) y debe ir codificado como URL (: se escribe %3A). La respuesta es una lista de pares value y label:

[
  { "value": "java", "label": "Java" },
  { "value": "python", "label": "Python" },
  { "value": "php", "label": "PHP" }
]

Para usarlo en el formulario:

1. Seleccione el campo desplegable en el diseñador y establezca su Name con el campo de metadatos (okp:tpl.language).
2. En el panel derecho, abra la sección Choices from a Web Service.
3. En Web service URL, pegue la URL. Lo más sencillo es seleccionar el elemento en la barra superior y pulsar Copy field options URL, que la genera ya codificada.
4. Establezca Get value to store from the following property a value y Get value to display from the following property a label.