web-dev-qa-db-ja.com

チェックボックス付きのフォームで#statesを使用する

クライアントがいずれかのチェックボックスをオンにすると、テキストフィールドが表示されます。例：彼が3つのチェックボックスをクリックすると、3つのすべてのテキストフィールドが表示されます。私の#checkboxes：

$form['input']['livraison'] = [
      '#title' => t('Options de livraison (à la charge de l’acheteur)'),
      '#type' => 'checkboxes',
      '#description' => t(''),
      '#options' => [
        'home' => $this->t('Retrait chez moi (gratuit)'),
        'hand' => $this->t('Remise en main propre (gratuit)'),
        'myself' => $this->t('Je livre moi-même le produit'),
        'colissimo' => $this->t('Colissimo'),
        'custom' => $this->t('Livraison personnalisée'),
      ],
      '#attributes' => [
        //define static name and id so we can easier select it
        'id' => 'select-shipping',
        'name' => 'field_select_shipping',
      ],
    ];

そして私のテキストフィールド：

$form['input']['adresse_home'] = [
      '#type' => 'textfield',
      '#title' => 'Adresse',
      '#required' => false,
      '#states' => [
        //show this textfield only if the radio 'other' is selected above
        'visible' => [
          ':input[name^="field_select_shipping"]' => [['checked' => 'false'], ['value' => 'home']],
          ':input[name^="field_select_shipping"]' => [['checked' => 'false'], ['value' => 'hand']],
          ':input[name^="field_select_shipping"]' => [['checked' => 'false'], ['value' => 'myself']],
          ':input[name^="field_select_shipping"]' => [['checked' => 'false'], ['value' => 'colissimo']],
          ':input[name^="field_select_shipping"]' => [['checked' => 'true'], ['value' => 'custom']],
],
      ],
    ];

**解決 ： **

Berramouが送信したように、この方法はチェックボックスで最もよく機能する方法です。
問題がある場合は、プラグインが状態をブロックできなかったかどうかを確認してください。iCheckで私に何が起こったのでしょうか。
チェックされたすべての入力を表示する必要がある場合は、TRUE条件を「可視」に設定するだけで、2つのオプションを選択して両方を正しく表示できます。

8formsjavascriptajax
2
StefanYYC

チェックボックス要素の状態を使用するには、JQueryセレクターで特定の要素をターゲットにする必要があります。それらの要素にはname="field_select_shipping"とvalue属性が異なります。両方の属性で入力をターゲットにして、以下を試してください。 homeおよびcolissimoチェックボックスがオンの場合にのみadresse_homeを表示します。

$form['input']['adresse_home'] = [
      '#type'     => 'textfield',
      '#title'    => 'Adresse',
      '#required' => FALSE,
      '#states'   => [
        'visible' => [
         ':input[name="field_select_shipping"][value="home"]' => ['checked'   => TRUE],
         // This like AND so the input show if home and colissimo checked 
        ':input[name="field_select_shipping"][value="colissimo"]' => ['checked'   => TRUE],
        ],
      ]
    ];
3
berramou

あなたのアプローチは正しいですが、構文が間違っています。

$form['input']['adresse_home'] = [
  '#type' => 'textfield',
  '#title' => 'Adresse',
  '#required' => false,
  '#states' => [
    'visible' => [
      ':input[name^="field_select_shipping"]' => [['checked' => 'true'], ['value' => 'home']],
     // Omitted the rest.
  ],
];

[〜＃〜] update [〜＃〜]コメント付き ここ には、すでに含まれている名前を適切に設定する必要があります値。私はそれを機能させませんでしたが、^ =セレクターを使用し、ANDターゲット条件を使用してそれを機能させました。

優れた 記事 フォームステートAPIについて、Drupal 7は完全に有効です。

0
d70rr3s