web-dev-qa-db-ja.com

AJAXで検証されたフォームを取得するにはどうすればよいですか?

AJAXでロードされ、 Foundation Reveal で表示される)かなり単純なフォームを構築しています。フォームの送信をAJAXで機能させることができ、リビール内のマークアップを更新できます、ただしAJAXを使用した送信ボタンでは、検証メソッドは実行されません。

どうして? AJAXで検証されたフォームを取得するにはどうすればよいですか?

通常のフォーム検証プロセスが必要です。ここでは、独自の検証を_::validateForm_に追加して、制御をAJAXフォーム送信ハンドラーに渡すことができます。

_$form['submit'] = [
  '#type' => 'submit',
  '#value' => 'Tallenna',
  '#ajax' => [
    'callback' => '::ajaxFormSubmitHandler'
  ]
];
_

$form['#validate'] = array('::validateForm');を試してみましたが、機能しません。また、次のコードを使用して、送信ハンドラでForm::validateForm($form, $form_state)を呼び出してみました。

_Form::validateForm($form, $form_state);
if ($form_state->hasAnyErrors()) {
  $form_state->setRebuild();
  $errors = $form_state->getErrors();
  return($form);
}
else {
  $form_state->setRebuild(FALSE);
}
_

単一の要素のコールバックを設定できます。

_$form['field_asiakkaan_nimi'] = [
  '#type' => 'textfield',
  '#title' => $this->t('Asiakkaan nimi'),
  '#required' => TRUE,
  '#ajax' => [
    'callback' => array($this, 'validateNimiAjax'),
    'event' => 'change',
  ],
  '#suffix' => '<span class="nimi-valid-message"></span>'
];
_

そのコールバックをフィールド処理に使用できます。

_  public function validateNimiAjax(array &$form, FormStateInterface $form_state) {
    $response = new AjaxResponse();
    $message = 'Nimi validoitu!';
    $response->addCommand(new HtmlCommand('.nimi-valid-message', $message));
    return $response;
  }
_

これはこれに対処する適切な方法ではないようです。

このエラーも発生しています:

フォームが古くなっています。保存されていない作業を以下のフォームにコピーしてから、このページを再読み込みしてください。

AJAX配信されたフォームを検証および処理するにはどうすればよいですか?

2
Janne Suominen

以下は、データを検証する非常に基本的な例です。それはあなたにそれを処理する方法のアイデアを与えるはずです:

class myForm extends FormBase
{
  public function getFormId()
  {
    return 'my_form';
  }

  public function buildForm(array &$form, FormStateInterface $form_state)
  {
    $form['#prefix'] = '<div id="my_form_wrapper">';
    $form['#suffix'] = '</div>';
    $form['some_text'] = [
      '#type' => 'textfield',
      '#title' => $this->t('Enter a value'),
    ];

    $form['submit'] = [
      '#type' => 'submit',
      '#value' => $this->t('Submit'),
      '#ajax' => [
        'wrapper' => 'my_form_wrapper',
        'callback' => '::ajaxCallback',
      ],
    ];

    return parent::buildForm($form, $form_state);
  }

  public function validateForm(array &$form, FormStateInterface $form_state)
  {
    if($form_state->getValue('some_text') != 'Awesome')
    {
      $form->setValue('some_text', $this->t('Please enter "Awesome"'));
    }
    parent::validateForm($form, $form_state);
  }

  public function ajaxCallback(array &$form, FormStateInterface $form_state)
  {
    return $form;
  }

  public function submitForm(array &$form, FormStateInterface $form_state)
  {
    drupal_set_message($this->t('The form was submitted'));

    parent::submitForm($form, $form_state);
  }
}

上記のコードでフォームが作成され、ajaxが設定されます。 validateForm()メソッドが存在する場合は自動的に呼び出されるため、検証を設定する必要はありません。 ajaxが実行されると、常に検証フォームメソッドが最初に呼び出されます。検証が渡されると、submitForm()メソッドが呼び出されますが、検証が失敗した場合は呼び出されません。最後に、ajaxコールバックが呼び出され、フォームが返されます。

2
Jaypan

これは正しいように見えますが、クラスの代わりにIDを使用してみてください

  '#ajax' => [
    'callback' => '::ajaxFormSubmitHandler'
  ]

そして

//$response->addCommand(new HtmlCommand('.nimi-valid-message', $message));
$response->addCommand(new HtmlCommand('#nimi-valid-message', $message));

例: http://www.drupal8.ovh/en/tutoriels/26/ajax-form

0
Net