Drupal 7でのフィールドAPIフィールドの動的な非表示/表示


15

「新規追加」フォームでエンティティを作成しました。エンティティ自体には、実際の変数の数が限られています。カスタムフィールド(つまり、フィールドAPI)を使用して必要な追加データのほとんどを追加しました。

この段階で行う必要があるのは、あるフィールドの値に基づいて、あるフィールドを動的に非表示にできることです。つまり、ドロップダウンフィールドの値が[いいえ]に設定されている場合、別のフィールドを非表示にする必要があります。それ以外の場合は表示する必要があります。

私が見ることができることから、この機能をForm APIを使用して作成されたフィールドに追加するのは簡単です(つまり、AJAXプロパティを介して)が、添付フィールドを使用してそれを達成する方法はありますか?これを解決するために必要な場合、カスタムJavascriptを使用しても問題はありません。


drupal.org/project/conditional_fieldsがまだ d7に移行する準備ができているかどうかはわかりませんが、検討する価値があるかもしれません
ジュークボックス

回答:


6

jQueryはこれに適しています。

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

ええ、私はフォームページでdrupal_add_jsを使用し、jQueryでそれを実行することになりました。これを行うために、より「Drupal」な方法があるのか​​と思っていました。
NRaf

私は、可視性に対するDrupalの#statesアプローチの大ファンではないことに言及します。そのため、上記で提案しませんでした。
キース14年

@keithm州のファンではない理由について詳しく説明していただけますか(2015年、D7)。#statesとdrupal_add_jsの使用を決定しようとしているプロジェクトに取り組んでいます。なぜあなたは一方が他方よりも良い選択だと思いますか?
blue928 14

私の意見では、それは正当なプログラマーの好みの問題です。私の理論的根拠はあなたのものとは異なるかもしれません。ただし、実際には、Javascript / jQueryにある機能を複製する別の構文に頼るのはむしろ嫌いです。#statesを試してみると、明らかに設計されているユースケースが制限されすぎていることがわかりました。私の問題がこれらのユースケースの外に広がったとき、とにかくまっすぐなJavascriptで全体を書き直さなければなりませんでした。
keithm 14

20

Drupal 7 #statesでは、カスタムjQueryスクリプトの代わりに$ formを使用できます。例:

  $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'),
      ),
    ),
  );

#states複数値の条件に使用する場合の例を次に示します。

 $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),
      ),
    ),
  );

詳細と例については、form_example/form_example_states.incfrom サンプルモジュールを参照してください。


と言えば#states、次のような、より複雑な可視性条件を定義する方法を見つけたことがありません。そのための構文を知っていますか?
アルトゥール

1
上記の私の更新を参照してください
milkovsky

5

Conditional Fieldsを試してみてください。このモジュールはこのタスクに不可欠なものだと思います。ユーザーフレンドリーな管理インターフェースのフィールド間に依存関係を設定できます。たとえば、あなたが設定できるAだけであることを、フィールドを目に見える場合はB、フィールドの値が「持っている1234」、またはあなたが設定できるCようにテキストフィールドを表示する場合にのみD、フィールドがチェックされている、またはセットEにフィールド見えない場合はF、ISが集中など

アップロードフォームでは、これらの依存関係はクライアント側で設定され、ノード表示では、これらの依存関係はサーバー側で設定されます。

これらの依存関係はで設定できadmin/structure/types/manage/[YOURCONTENTTYPESMACHINENAME]/dependenciesます。

条件付きフィールド (画像のソース:プロジェクトのページ

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.