如何使用AJAX显示来自服务器端验证的内联错误消息

时间:2015-05-09 18:33:54

标签: javascript php jquery ajax symfony

我希望在不重新加载页面的情况下显示来自Symfony2 Backend的内联错误消息。

我认为我可以用经过验证的表单替换HTML中的现有表单,并使用后端通过AJAX返回的错误消息。

但我无法识别代码中的错误。

我是整个网络开发的新手,所以当有一些初学者错误时,请不要责备我。

我从实体和表单类型渲染表单。

contactEntity

contactType

我的表单看起来像这样:

  <form id="contact-form"
        action="{{ path('sendContact') }}"
        method="post" {{ form_enctype(form) }}>
    <h2 class="text-center">Kontaktieren Sie uns</h2>


    {{ form_row(form.name, {'label': 'Name'}) }}
    {{ form_row(form.email, {'label': 'Email'}) }}
    {{ form_row(form.subject, {'label': 'Betreff'}) }}
    {{ form_row(form.message, {'label': 'Nachricht'}) }}

    {{ form_rest(form) }}

    <div class="form-group">
      <div class="col-sm-offset-2 col-sm-10">
        <button style="width:100%"
                id="contact-form-button"
                type="submit"
                class="btn btn-default">
          Senden
        </button>

      </div>
    </div>
  </form>

我的ContactController:

<?php

namespace piano\PageBundle\Controller;

use piano\PageBundle\Entity\Contact;
use piano\PageBundle\Form\ContactType;
use Symfony\Bundle\FrameworkBundle\Controller\Controller;
use Sensio\Bundle\FrameworkExtraBundle\Configuration\Route;
use Sensio\Bundle\FrameworkExtraBundle\Configuration\Template;
use Symfony\Component\HttpFoundation\Response;
use Symfony\Component\HttpFoundation\JsonResponse;
use Symfony\Component\HttpFoundation\Request;


class ContactController extends Controller
{
  /**
   * @Route("/kontakt", name="contact")
   */
  public function indexAction()
  {
    $contact = new Contact();
    $form = $this->createForm(new ContactType(), $contact);


    return $this->render('pianoPageBundle:Contact:show.html.twig', array(
      'form' => $form->createView()
    ));
  }

  /**
   * @Route("/kontakt/senden", name="sendContact")
   */
  public function sendAction(Request $request)
  {
    $contact = new Contact();
    $form = $this->createForm(new ContactType(), $contact);
    $form->handleRequest($request);

    if ($form->isValid()) {

      $mailer = $this->get('mailer');
      $message = $mailer->createMessage()
        ->setSubject($form->get('subject'))
        ->setFrom('email@example.com')
        ->setTo('some@mail.com')
        ->setBody(
          $this->renderView(
            'pianoPageBundle:Emails:contact.html.twig',
            array('form' => $form)
          ),
          'text/html'
        );
      $mailer->send($message);
      return new JsonResponse(array(
        'success' => true
      ));
    } else {
      return new Response($form->createView(), 201, array(
          'data' => $form->createView(),
          'Content-Type' => 'application/x-www-form-urlencoded')
      );
    }
  }
}

这是我的js:

$("#contact-form").submit(function (e) {
    e.preventDefault();

    $.ajax({
        url: $(this).attr("action"),
        dataType: 'text',
        method: $(this).attr("method"),
        contentType: 'application/x-www-form-urlencoded',
        data: $(this).serialize(),
        success: function (data) {
            //send mail
        },
        error: function (response) {
            $("#contact-form").replaceWith(response.data);
        }
    });
});

我的问题是,我收到错误消息:

The Response content must be a string or object implementing __toString(), &quot;object&quot; given. (500 Internal Server Error)

我尝试了很多时间来解决问题,但我不知道更换整个表单的正确响应类型。

1 个答案:

答案 0 :(得分:1)

您使用的是错误的Request类。你应该使用:

use Symfony\Component\HttpFoundation\Request;

其余的看起来还不错。

回答你的下一个问题:

你应该改变这个:

return new Response($form->createView(), 201, array(
          'data' => $form->createView(),
          'Content-Type' => 'application/x-www-form-urlencoded')
      );

为:

return $this->render('formview.html.twig', array(
      'form' => $form->createView()
    ));