Pragmatic permite la creación de eventos que facilitan la precarga de datos en una instancia de formulario. Estos datos pueden obtenerse ya sea desde un servicio externo utilizando la instancia de axios, proporcionada por Pragmatic, o definirse directamente dentro de la función JavaScript del evento.

La ejecución del evento ocurre exclusivamente en el momento de ejecución Cargar. Este momento ocurre cuando el usuario accede al formulario por lo que es en este caso donde se busca obtener los datos, cargarlos sobre la instancia y que los datos sean visibles inmediatamente en los campos correspondientes.



Creación de eventos de precarga de datos

Condiciones para la creación de un evento de precarga de datos

Para que un evento de precarga de datos funcione correctamente, se deben cumplir los siguientes requisitos:

  1. Debe ser un evento de tipo función (JavaScript), esta función debe retornar una estructura de respuestas.

  2. La estructura de respuestas de los campos debe seguir una sintaxis para el mapeo correcto de los datos.

  3. Una vez creado, el evento debe asociarse al formulario y configurarse en la sección de eventos de un formulario, para ejecutarse en el momento de carga de la instancia de formulario.



Sintaxis esperada

Para que la precarga de datos funcione correctamente, la función debe retornar un arreglo de objetos, donde cada objeto contenga:

  • id: El identificador del campo donde se mapeará la respuesta.

  • value: El valor correspondiente a ese campo.

Estructura de respuesta por tipo de campo

Cada tipo de campo de Pragmatic maneja una estructura de respuesta la cual debe ser seguida para mapearse correctamente en la instancia del formulario.

Tipo de CampoEstructura de RespuestaValor
TextoEl valor es de tipo string, es decir, un texto simple."Juan Pérez"
PorcentajeEl valor es un número entero, pero se debe almacenar como string."75"
GrillaLa estructura es un arreglo de arreglos, donde cada sub-arreglo tiene un número seguido de un texto.[[1, "Item A"], [2, "Item B"]]
PromptLa estructura es un objeto que tiene una propiedad value de tipo number y una propiedad description que es un arreglo de objetos con label (string) y value (puede ser string, boolean o number).{ "value": 3, "description": [{ "label": "Categoría", "value": "Evento" }] }
Archivo adjuntoLa estructura es un arreglo de objetos, donde cada objeto tiene las propiedades uuid, name, type y size (todas son requeridas).[ { "uuid": "id-unico", "name": "documento.docx", "type": "application/vnd.openxmlformats-officedocument.wordprocessingml.document", "size": 45678 } ]
Texto largoEl valor es de tipo string, pero se permite incluir saltos de línea."Descripción línea 1\nDescripción línea 2"
FechaEl valor es un string en formato ISO 8601, que tiene la forma "YYYY-MM-DDTHH:MM:SS.sssZ". Esto representa una fecha y hora con precisión hasta los milisegundos. Ejemplo: "1999-12-31T23:59:59.999Z"."1999-12-31T23:59:59.999Z"
NúmeroEl valor es de tipo number, y debe ser un número entero o decimal. Esto se valida verificando que typeof value === "number". Esto asegura que solo los valores numéricos sean aceptados.42
ComboEl valor es un objeto con la propiedad value, que puede ser de tipo number o string. La estructura es: module.exports = { type: "object", properties: { value: { type: ["number", "string"] } }, required: ["value"] };{ "value": "Opción 1" }
Combo múltipleEl valor es un arreglo de objetos, donde cada objeto tiene las propiedades value y label, ambas de tipo string.[ { "value": "Opción 1", "label": "Etiqueta 1" }, { "value": "Opción 2", "label": "Etiqueta 2" } ]



Ejemplo de estructura por cada tipo de campo

Para un formulario que contiene cada tipo de campo, la estructura correcta para precargar los datos de cada campo sería la siguiente:

[
  {
    "id": "21", // Porcentaje
    "value": "98"
  },
  {
    "id": "23", // Texto
    "value": "Juan Pérez"
  },
  {
    "id": "25", // Grilla
    "value": [
      [1, "Producto A"],
      [2, "Producto B"]
    ]
  },
  {
    "id": "26", // Prompt
    "value": {
      "value": 2,
      "description": [
        {
          "label": "id",
          "value": 2
        },
        {
          "label": "Nombre",
          "value": "Hackathon Tecnológico"
        },
        {
          "label": "Es presencial",
          "value": "No"
        }
      ]
    }
  },
  {
    "id": "28", // Archivo adjunto
    "value": [
      {
        "uuid": "123e4567-e89b-12d3-a456-426614174000",
        "name": "documento.pdf",
        "type": "application/pdf",
        "size": 102400
      }
    ]
  },
  {
    "id": "30", // Texto largo
    "value": "Descripción línea 1\nDescripción línea 2"
  },
  {
    "id": "31", // Fecha
    "value": "2023-05-15T10:30:00.000Z"
  },
  {
    "id": "36", // Número
    "value": 100
  },
  {
    "id": "37", // Combo
    "value": {
      "value": "primaria",
      "label": "Primaria"
    }
  },
  {
    "id": "53", // Combo múltiple
    "value": [
      {
        "value": "laptop",
        "label": "Laptop Dell"
      },
      {
        "value": "monitor",
        "label": "Monitor 24 pulgadas"
      }
    ]
  }
]