web-dev-qa-db-ja.com

フィールド値が変更されたときにフォームを送信する

次のようなメソッドGETを使用した単純なフォームがあります...

function MYMODULE_form($form, &$form_state) {
  $form['#method'] = 'get';
  $params = drupal_get_query_parameters();
  $form['cat'] = array(
    '#type' => 'select',
    '#title' => t('Categories'),
    '#options' => $categories,
    '#default_value' => isset($params['cat']) ? $params['cat'] : '',
  );
  $form['submit'] = array(
    '#type' => 'submit',
    '#value' => t('Submit'),
  );
}

GETは、デフォルトの送信機能と検証機能を実際にバイパスします。 「カテゴリ」フィールドの値が変更されたときに、送信ボタンなしでこのフォームを送信したい。

function MYMODULE_form($form, &$form_state) {
  $form['#method'] = 'get';
  $params = drupal_get_query_parameters();
  $form['cat'] = array(
    '#type' => 'select',
    '#title' => t('Categories'),
    '#options' => $categories,
    '#default_value' => isset($params['cat']) ? $params['cat'] : '',
    '#ajax' => array(
      'callback' => 'MYMODULE_form_submit',
    ),
  );
}

どうすればよいですか？

7formsajax
5
Tanvir Ahmad

これは、属性を使用してこれを行うことができた方法です...

'#attributes' => array('onchange' => 'this.form.submit();'),

だからそれは単純だった...

function MYMODULE_form($form, &$form_state) {
  $form['#method'] = 'get';
  $params = drupal_get_query_parameters();
  $form['cat'] = array(
    '#type' => 'select',
    '#title' => t('Categories'),
    '#options' => $categories,
    '#default_value' => isset($params['cat']) ? $params['cat'] : '',
    '#attributes' => array('onchange' => 'this.form.submit();'),
  );
}

これで、フィールドが変更されたときにフォームを送信できます。

6
Tanvir Ahmad

このような？

css：

MY_FORM_SELECTOR input[type="submit"] {display:none;}

#ajaxプロパティなし：

JS：

$('CAT_SELECT').change(function() {
   $(this).closest('form').submit();
});

または、送信フィールドの#ajaxプロパティを使用：

$('CAT_SELECT').change(function() {
   $(this).closest('form').find('input[type=submit]').click();
});

UPDATE：

  • テーマディレクトリにJSファイルを作成する
  • MYTHEME.infoファイルを開き、scripts[] = JSFILENAME.jsを追加します
  • JSファイルを開き、次のように記述します。

コード：

(function ($) {
  Drupal.behaviors.SomeUniqueName = {
    attach: function (context, settings) {
      $('CAT_SELECT').change(function() {
        $(this).closest('form').submit();
      });
    }
  };
})(jQuery);

キャッシュをクリアします。それだけです。

ps：// AJAXでフォームを送信する場合、 この要点 が役立ちます

2
xurshid29