Inicio
NexoPOS

Actualización condicional del campo

A partir de NexoPOS 5.3.x, ciertos campos como "select", "multiselect" y "search-select" estarán sujetos a que se actualicen condicionalmente sus opciones en función de los valores de sus hermanos.

La idea aquí es ofrecer siempre opciones precisas al usuario en función de una elección previa que haya realizado. Supongamos que tienes un formulario con 2 campos de tipo select. El primer campo de selección muestra todos los países y el segundo muestra las ciudades del país. Tiene más sentido si las opciones del segundo campo de selección se actualizan para que coincidan con el país seleccionado en el primer campo.

Configuración del campo

Para que un campo observe otros campos y actualice sus opciones, necesitas proporcionar algunas opciones adicionales al campo desde el lado del backend.

<?php
use App\Classes\FormInput;

// ...

$country = FormInput::searchSelect(
  label: __( 'Countries' ),
  name: 'country',
);

$town = FormInput::searchSelect(
  label: __( 'Town' ),
  name: 'town',
  refresh: FormInput::refreshConfig(
    url: '', // url to fetch new options
    watch: 'country', // the name of the field to watch changes
);

En el ejemplo anterior, el primer campo es «country» y el segundo es «town». En el segundo campo, proporcionaremos la opción «refresh», para la cual usaremos FormInput::refreshConfig. Esta función devuelve un array con «url» y «watch».

url: Esta es la URL que se debe usar para obtener las nuevas opciones. Ten en cuenta que NexoPOS realizará una solicitud POST a esa URL con solo la entrada "identifier", que es el valor seleccionado en el campo "watch" (en nuestro ejemplo, es el país).

vigilar: Este es el nombre del campo que se debe vigilar. Ante cualquier cambio que se realice en ese campo, se notificará a todos los campos que definen una propiedad de «actualización».

Valor devuelto

Como NexoPOS solicita la URL proporcionada, esa URL debe devolver una respuesta válida para que funcione. La entrada que esperan los cambios de watch como respuesta es una lista de opciones en un array. Usa "Helper::toJsOptions" para convertir una colección de modelos en un array de JavaScript válido que NexoPOS pueda entender.

image770394

Este es un ejemplo de la salida esperada por NexoPOS.