AJAX表单验证并提交

Question

我在Drupal 7中创建了一个表单并希望使用AJAX.我将其添加到提交按钮数组:

"#ajax" => array(
  "callback" => "my_callback",
  "wrapper" => "details-container",
  "effect" => "fade"
)

这有效,但忽略了整个验证功能.如何在my_callback()调用之前验证表单？如何在AJAX表单上显示状态或错误消息？

Answer 1

这个问题和答案有助于指导我找到正确的解决方案,但它并不十分清晰.让我们这样做吧.

事情是非常清楚:

1. 验证错误消息将放在指定的内容中 #ajax['wrapper']
2. 密切关注ajax包装器的Drupal Forms API文档所说的"具有此ID的整个元素被替换,而不仅仅是元素的内容."
3. 因为替换了该元素,所以最好再次提供它. 这就是为什么Marius Ilie的答案有效 - 不是因为数组#markup,而是因为他用包装id设置包含div.

根据Marius在上面的评论中提出的内容,以下是为我工作的代码:

function dr_search_test_form($form, &$fstate) {
  $form["wrapper"] = array("#markup" => "<div id='test-ajax'></div>");

  $form["name"] = array(
    "#type" => "textfield",
    "#required" => true,
    "#title" => "Name"
  );

  $form["submit"] = array(
    "#type" => "submit",
    "#value" => t("Send"),
    "#ajax" => array(
      "callback" => "dr_search_test_form_callback",
      "wrapper" => "test-ajax",
      "effect" => "fade",
    ),
  );
  return $form;
}

function dr_search_test_form_callback($form, &$fstate) {
  return "<div id='test-ajax'>Wrapper Div</div>";
}

function dr_search_test_form_validate($form, &$fstate) {
  form_set_error("name", "Some error to display.");
}

Answer 2

我找到了解决这个问题的出色方法.

归功于这家伙的博客:

http://saw.tl/validate-form-ajax-submit-callback

他提出的解决方案如下:

// when creating or altering the form..
{
  $form['#prefix'] = '<div id="formwrapper">';
  $form['#suffix'] = '</div>';
  // the submit button
  $form['save']['#ajax'] = array(
    'callback' => 'mymodule_form_ajax_submit',
    'wrapper' => 'formwrapper',
    'method' => 'replace',
    'effect' => 'fade',
  );
 // ...
}

function mymodule_from_ajax_submit($form, &$form_state) {
  // validate the form
  drupal_validate_form('mymodule_form_id', $form, $form_state);
  // if there are errors, return the form to display the error messages
  if (form_get_errors()) {
    $form_state['rebuild'] = TRUE;
    return $form;
  }
  // process the form
  mymodule_form_id_submit($form, $form_state);
  $output = array(
    '#markup' => 'Form submitted.'
  );
  // return the confirmation message
  return $output;
}

Answer 3

这些都不适合我.表单提交的ajax函数仍然只是直接调用回调函数,绕过验证,提交,并使其无法多次单击按钮.验证消息不会显示.我完全复制并粘贴了Joshua Stewardson代码,但它没有用.

这个使用案例如此困难且没有文档记录的事实非常令人沮丧.对我来说,这似乎是对AJAX表单API的最基本的请求.好的,把我的沮丧放在了解决方案上.

这就是我最终要做的就是让它发挥作用.它感到hacky和迟钝.如果在单个页面上有多个表单实例,它也会中断,但这是我能做的最好的.如果有人能说明这一点请做!

基本上,您必须在回调中替换整个表单,并手动将任何设置的消息预先添加到表单对象.通过将包装器声明为表单的id来执行此操作(如果在单个页面上有多个表单实例,则会中断,因为ID将更新).

function productsearchbar_savesearch_form($form, &$form_state) {

  $form["wrapper"] = array("#markup" => "<div class='inline-messages'></div>");

  $form["name"] = array(
    "#type" => "textfield", 
    "#required" => true,
    "#title" => "Name"
  );

  $form["submit"] = array(
    "#type" => "submit", 
    "#value" => "Send", 
    "#ajax" => array(
      "callback" => "productsearchbar_savesearch_form_callback", 
      "wrapper" => "productsearchbar-savesearch-form", 
      "effect" => "fade"
    )
  );

  return $form;
}

function productsearchbar_savesearch_form_callback($form, &$form_state) {
  $messages = theme('status_messages');

  if($messages){
    $form["wrapper"] = array("#markup" => "<div class='inline-messages'>$messages</div>");
  }
  return $form;
}

function productsearchbar_savesearch_form_validate($form, &$form_state) {
  if ($form_state['values']['name'] == '') {
   form_set_error('', t('Name field is empty!'));
  }
}

function productsearchbar_savesearch_form_submit($form, &$form_state) {
  drupal_set_message(t('Your form has been saved.'));
}

Answer 4

好的,我明白了.显然你应该在你的ajax回调函数上返回一个数组,而不仅仅是一条短信...

像这样的东西:

return array("#markup" => "<div id='wrapper'></div>");