Saltar al contenido principal

Enviando un formulario con un tipo de campo de entidad (páginas, productos...)

En este ejemplo, demostramos cómo enviar un formulario que incluye un tipo de campo de entidad, como páginas o productos, utilizando la API de OneEntry.

✅ Propósito del escenario:

  • Obtener la configuración del formulario de la Plataforma OneEntry
  • El usuario selecciona uno de los elementos de la entidad
  • Enviar los datos recopilados a la API de OneEntry.

✅ Lo que necesitas:

  • Una PROJECT_URL y APP_TOKEN válidos para la autenticación con la API de OneEntry.
  • Un formulario preconfigurado en OneEntry con un marcador (por ejemplo, entidad) y campos que incluyan uno de tipo "entidad".
  • Campos de formulario preconfigurados que incluyan uno de tipo "entidad".

📌 Importante:

  • No manejamos errores en estos ejemplos.
  • Puedes manejar errores en trycatch o en una construcción como "await Promise.catch((error) => error)"

Escenario

1. Importar oneEntry y definir url y token

Ejemplo:

import { defineOneEntry } from 'oneentry';

const PROJECT_URL = 'your-project-url';
const APP_TOKEN = 'your-app-token';

2. Crear un cliente API con la función defineOneEntry()

Ejemplo:

const { AuthProvider, Orders, Payments, Forms } = defineOneEntry(PROJECT_URL, {
token: APP_TOKEN,
});

3. Recibimos datos del formulario de la Plataforma OneEntry para generar un formulario en el frontend con Forms.getFormByMarker()

Ejemplo:

const formData = await Forms.getFormByMarker('entity');
Resultado:
{
"id": 2,
"attributeSetId": 1,
"type": "data",
"localizeInfos": {
"title": "Entidad",
"titleForSite": "",
"successMessage": "",
"unsuccessMessage": "",
"urlAddress": "",
"database": "0",
"script": "0"
},
"version": 17,
"position": 1,
"identifier": "entity",
"processingType": "script",
"templateId": null,
"attributes": [
{
"type": "entity",
"marker": "entity",
"isLogin": null,
"isSignUp": null,
"position": 1,
"settings": {},
"isVisible": true,
"listTitles": [
{
"id": 1,
"depth": 0,
"title": "Catálogo",
"parentId": null,
"position": 1,
"selected": true
},
{
"id": 7,
"depth": 0,
"title": "Página premium",
"parentId": null,
"position": 2,
"selected": true
}
],
"validators": {},
"localizeInfos": {
"title": "Entidad"
},
"additionalFields": [],
"isNotificationEmail": null,
"isNotificationPhoneSMS": null,
"isNotificationPhonePush": null
}
]
}

4. Seleccionar uno de los elementos del atributo de tipo entidad y pasar a valor como un array de ids(números) para páginas o array de cadenas para productos

Ejemplo:

[
{
"marker": "entity",
"type": "entity",
"value": [
1
]
}
]

5. Publicar datos del formulario con FormData.postFormsData()

Ejemplo:

const response = FormData.postFormsData({
formIdentifier: 'entity',
formData: fieldsData,
});
console.log(response);
Resultado:
{
"formData": {
"formIdentifier": "entity",
"time": "2025-08-29T17:30:21.596Z",
"formData": [
{
"marker": "entity",
"type": "entity",
"value": [
1
]
}
],
"id": 94
},
"actionMessage": ""
}

Ejemplo final

// 1. Importar oneEntry y definir PROJECT_URL y APP_TOKEN
import { defineOneEntry } from 'oneentry';

const PROJECT_URL = 'your-project-url';
const APP_TOKEN = 'your-app-token';

// 2. Crear un cliente API:
const { Forms, FormData } = defineOneEntry(PROJECT_URL, {
token: APP_TOKEN,
});

// 3. Recibimos datos del formulario de la Plataforma OneEntry para generar un formulario en el frontend
const formData = await Forms.getFormByMarker('entity');

// 4. seleccionar uno de los elementos del atributo de tipo entidad
const fieldsData = [
{
marker: 'entity',
type: 'entity',
value: [
1,
],
},
];

// 5. Publicar datos del formulario con FormData.postFormsData()
let response = await FormData.postFormsData({
formIdentifier: 'entity',
formData: fieldsData,
});
// console.log(response);