drupal9

Form API #states en Drupal 9 y 10

El Form API de Drupal tiene una caracteristica que no es muy conocida y es el sistema de estados (#states system).  Los #state de un formulario nos permiten crear campos que cambian de estado (mostrar, ocultar, habilitar, deshabilitar, etc.) según ciertas condiciones. De tal manera que no necesitamos escribir JavaScript personalizado para estos estados.

Para nuestro caso vamos a escribir un formulario en donde habrán 2 campos select_url y url:

    $form['select_url'] = [
      '#type' => 'select',
      '#title' => $this->t('Desea poner una URL'),
      '#options' => [
        'si' => $this->t('Sí'),
        'no' => $this->t('No'),
      ],
      '#empty_option' => $this->t('- Select -'),
      '#required' => TRUE,
    ];

    $form['url'] = [
      '#type' => 'textfield',
      '#title' => $this->t('City'),
    ];

Para nuestro ejemplo por ahora se muestan ambos campos, pero vamos a condicionar que si en select_url seleccionamos un 'Sí' entonces se mostrará el campo url. Para ellos pondremos el siguiente código:

      '#states' => [
        'visible' => [
          ':select[name="select_url"]' => ['value' => 'si'],
        ],
      ],

Aquí estamos añadiendo la condición para la visibilidad del campo 'visible', y si este value del select_url es un 'si', recién se mostrará el campo url. con lo que nuestro código quedaría así:

    $form['select_url'] = [
      '#type' => 'select',
      '#title' => $this->t('Desea poner una URL'),
      '#options' => [
        'si' => $this->t('Sí'),
        'no' => $this->t('No'),
      ],
      '#empty_option' => $this->t('- Select -'),
      '#required' => TRUE,
    ];

    $form['url'] = [
      '#type' => 'textfield',
      '#title' => $this->t('URL'),
      '#states' => [
        'visible' => [
          'select[name="select_url"]' => ['value' => 'si'],
        ],
      ],
    ];

Para otras referencias podemos consultar estos artículos:

Me pareció interesante el artículo

Deseo más información

O también puedes comunicarte con nosotros.

por whatsapp por whatsapp

Añadir nuevo comentario

Me gustaría más información sobre:

CAPTCHA