es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

Drupal 9.2.9 – Campo condicional en inline_entity_form (#states) no funciona

06 Aug, 2023 Programación

Tengo una entidad “aparcamiento” con varios “precios”, en el formulario de la entidad “aparcamiento” hay un campo “precios” que utiliza el widget inline_entity_form_complex. En el formulario del aparcamiento establezco campos condicionales con la API #states (para mostrar campos solo en ocasiones con un campo booleano). El #states funciona, pero solo en el formulario original de una entidad “precio”, pero cuando edito un precio desde la entidad “aparcamiento”, el #states no funciona. ¿Cómo se establece #states en un widget de campo inline_entity_form_complex? Los estados funcionan en un campo normal, pero en el widget no funciona.
Este es mi código. Por favor, mira el Gif #1 (funcionando) y el Gif #2 (no funcionando).

Creé un hook_form_FORM_ID_alter():

$form['field_level_time_unit']['#states'] = [
    'invisible' => [
      'input[name="field_level_pricing_mode"]' => ['value' => 0],
    ],
  ];

  $form['field_level_price']['#states'] = [
    'invisible' => [
      'input[name="field_level_pricing_mode"]' => ['value' => 0],
    ],
  ];

  $form['field_level_of_reference']['#states'] = [
    'visible' => [
      'input[name="field_level_pricing_mode"]' => ['value' => 0],
    ],
  ];

Los #states están funcionando aquí:
Los #states están funcionando aquí

Los #states no están funcionando con el widget inline_entity_form_complex:
Los #states no están funcionando con el widget inline_entity_form_complex

Tags:  , , ,

Answer

  1. Avatar for davy.ai
    davy.ai

    Para establecer #states en un widget de campo inline_entity_form_complex, deberá apuntar al elemento correcto en el widget utilizando su ID de elemento único. Esto se puede hacer utilizando jQuery.

    Primero, agregue un archivo JavaScript personalizado a su tema o módulo de Drupal, y agregue el siguiente código:

    (function ($) {
  $(document).ready(function() {
    // Reemplace "pricings" con el nombre de su campo.
    var widgetID = "edit-field-pricings";
    var widgetSelector = "#inline-entity-form-complex-" + widgetID;

    // Agregue su código #states aquí.
    // Reemplace "field_level_time_unit" y "field_level_price" con los ID de sus campos.
    $(widgetSelector + " input[name*='[field_level_pricing_mode]']").change(function() {
      var value = $(this).val();
      var timeUnitElement = $(widgetSelector + " input[name*='[field_level_time_unit]']");
      var priceElement = $(widgetSelector + " input[name*='[field_level_price]']");
      var referenceElement = $(widgetSelector + " input[name*='[field_level_of_reference]']");

      if (value == 0) {
        timeUnitElement.hide();
        priceElement.hide();
        referenceElement.show();
      }
      else {
        timeUnitElement.show();
        priceElement.show();
        referenceElement.hide();
      }
    });
  });
})(jQuery);

    Este código agrega un listener al elemento “field_level_pricing_mode” en el widget, y muestra u oculta los otros campos según su valor.

    Asegúrese de reemplazar “pricings” con el nombre de su campo, y “field_level_time_unit”, “field_level_price” y “field_level_of_reference” con los IDs de sus campos.

    Finalmente, agregue el archivo JavaScript a su tema o módulo de Drupal y limpie la caché. Los #states ahora deberían funcionar en el widget de campo inline_entity_form_complex.

Comments are closed.