Dynamiczne ukrywanie / wyświetlanie pól Field API w Drupal 7


14

Utworzyłem encję z formularzem „dodaj nowy”. Sama jednostka ma ograniczoną liczbę rzeczywistych zmiennych. Dodałem większość dodatkowych danych, których potrzebuję, używając niestandardowych pól (tj. Field API).

Na tym etapie muszę dynamicznie ukryć jedno pole na podstawie wartości drugiego. tzn. jeśli pole rozwijane ma wartość Nie, kolejne pole powinno być ukryte, w przeciwnym razie powinno zostać pokazane.

Z tego, co widzę, nieco łatwiej jest dodać tę funkcjonalność do pól utworzonych za pomocą interfejsu API Form (tj. Za pośrednictwem właściwości AJAX), ale czy jest jakiś sposób, aby to osiągnąć za pomocą dołączonych pól? Nie mam problemów z używaniem niestandardowego Javascript, jeśli jest to wymagane do rozwiązania tego problemu.


Nie jestem pewien, czy drupal.org/project/conditional_fields jest już gotowy na d7, ale może warto przyjrzeć się
Jukebox

Odpowiedzi:


5

jQuery działa dobrze do tego:

(function($) {
  $(document).ready(function() {
    $('#select1').change(function() {
      switch ($(this).val()) {
        case '1':
          $('#field2').hide();
          break;
        default:
          $('#field2').show();
          break;
      }
    });
  });
}) (jQuery);

Tak, skończyło się na użyciu drupal_add_js na stronie formularza i skończyło to na jQuery. Zastanawiałem się tylko, czy istnieje bardziej „Drupal” sposób na zrobienie tego.
NRaf,

Wspomnę, że nie jestem wielkim fanem podejścia Drupal #states do widoczności, dlatego nie zasugerowałem tego powyżej.
keithm

@keithm Czy mógłbyś wyjaśnić, dlaczego nie jesteś fanem stanów (stan na 2015 r., D7). Pracuję nad projektem, w którym próbujemy podjąć decyzję o użyciu #states vs drupal_add_js. Dlaczego uważasz, że jeden jest lepszym wyborem niż drugi?
blue928

Moim zdaniem jest to uzasadniona preferencja programisty; moje uzasadnienie może różnić się od twojego. To powiedziawszy, w praktyce raczej nie lubię uciekać się do innej składni, która powiela funkcjonalność znalezioną w Javascript / jQuery. Kiedy próbowałem #states, znalazłem również przypadki użycia, dla których najwyraźniej został zaprojektowany zbyt ograniczająco. Kiedy mój problem wykroczył poza te przypadki użycia, musiałem przepisać całość w prostym JavaScript.
keithm

19

W Drupal 7 możesz użyć $ form #stateszamiast niestandardowego skryptu jQuery. Przykład:

  $form['student_type'] = array(
    '#type' => 'radios',
    '#options' => array(
      'high_school'   => t('High School'),
      'undergraduate' => t('Undergraduate'),
      'graduate'      => t('Graduate'),
    ),
    '#title' => t('What type of student are you?')
  );

  // High school information.
  $form['high_school']['tests_taken'] = array(
    '#type' => 'checkboxes',
    '#options' => drupal_map_assoc(array(t('SAT'), t('ACT'))),
    '#title' => t('What standardized tests did you take?'),
    // This #states rule says that this checkboxes array will be visible only
    // when $form['student_type'] is set to t('High School').
    // It uses the jQuery selector :input[name=student_type] to choose the
    // element which triggers the behavior, and then defines the "High School"
    // value as the one that triggers visibility.
    '#states' => array(
      'visible' => array(   // action to take.
        ':input[name="student_type"]' => array('value' => 'high_school'),
      ),
    ),
  );

Oto przykład, jeśli chcesz użyć #stateswarunku dla wielu wartości:

 $form['student_type'] = array(
    '#type' => 'checkboxes',
    '#options' => array(
      'high_school'   => t('High School'),
      'undergraduate' => t('Undergraduate'),
      'graduate'      => t('Graduate'),
    ),
    '#title' => t('What type of student are you?')
  );

  // High school information.
  $form['high_school']['tests_taken'] = array(
    '#type' => 'textfield',
    '#title' => t('What standardized tests did you take?'),
    '#states' => array(
      'visible' => array(   // action to take.
        ':input[name="student_type[high_school]"]' => array('checked' => TRUE),
        ':input[name="student_type[undergraduate]"]' => array('checked' => TRUE),
        ':input[name="student_type[graduate]"]' => array('checked' => FALSE),
      ),
    ),
  );

Zobacz form_example/form_example_states.incz przykładów moduł więcej szczegółów i przykładów.


Mówiąc o tym #states, nigdy nie znalazłem sposobu na zdefiniowanie bardziej złożonych warunków widoczności, takich jak: ukryj kontrolkę A, gdy wartość kontrolki B znajduje się w tablicy (x, y, z). Czy zdarza ci się znać taką składnię?
Artur

1
Zobacz moją aktualizację powyżej
milkovsky

4

Powinieneś spróbować pól warunkowych , myślę, że ten moduł jest niezbędny do tego zadania. Można ustawić zależności między polami w przyjaznym dla użytkownika interfejsie administratora. Na przykład możesz ustawić, Aaby pole było widoczne tylko wtedy, gdy Bpole ma wartość „ 1234 ”, lub możesz ustawić pole Ctekstowe tak, aby było widoczne tylko wtedy, gdy Dpole jest zaznaczone, lub ustawić Epole na niewidoczne, jeśli Fjest aktywne itp.

W formularzu przesyłania te zależności zostaną ustawione po stronie klienta, na ekranie węzła te zależności zostaną ustawione po stronie serwera.

Możesz ustawić te zależności na admin/structure/types/manage/[YOURCONTENTTYPESMACHINENAME]/dependencies.

Pola warunkowe (Źródło obrazu: projekt za stronę )

Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.