2015-12-03 5 views
10

Мне нужно сохранить данные из формы с помощью symfony через ajax, чтобы я не обновил браузер. Кроме того, я нуждаюсь в вас в случае ошибок в полях, может каким-то образом получить их в ответ на этот вызов Ajax и показать мои ошибки формы, без обновления страницы.Проверка формы в symfony от вызова ajax

У меня есть форма с активом symfony, чтобы проверить поля и сделать все идеально, если выполняется ajax-вызов, сохраняет данные или обновляет страницу с ошибками, но мне нужно это же, не обновляя страницу.

Тогда я положил часть кода я использую:

Контроллер:

public function createAction(Request $request) 
{ 
    $entity = new Student(); 
    $form = $this->createCreateForm($entity); 
    $form->handleRequest($request); 

    if ($form->isValid()) { 
     $em = $this->getDoctrine()->getManager(); 
     $em->persist($entity); 
     $em->flush(); 

     return $this->redirect($this->generateUrl('student_show', array('id' => $entity->getId()))); 
    } 

    return $this->render('BackendBundle:Student:new.html.twig', array(
     'entity' => $entity, 
     'form' => $form->createView(), 
    )); 
} 

Ajax вызова: (я не понимаю, как обрабатывать часть ошибок)

$('.form_student').submit(function(event) { 
    event.preventDefault(); 

    $.ajax({ 
    type: 'POST', 
    url: Routing.generate('student_create'), 
    data: $(this).serialize(), 

    success: function(data) { 

     //clean form 
     cleanForm($(this)); 

     //show success message 
     $('#result').html("<div id='message'></div>"); 
     $('#message').html("<h2> student created</h2>").hide(); 
     $('#message').fadeIn('slow').delay(5000).fadeOut('slow'); 
     event.stopPropagation(); 
    }, 
    error: function (xhr, desc, err) 
     { 
     alert("error"); 
     } 
    }) 
    return false; 
}); 

Я видел, как некоторые возвращают JsonResponse от контроллера и используют Ajax, но я начинаю с Ajax, и я не знаю, как его использовать. Тогда я поставил код, я имею в виду:

if ($request->isXmlHttpRequest()) { 

    if ($form->isValid()) { 
    //... 
    return new JsonResponse(array('message' => 'Success!'), 200); 
    } 

    $response = new JsonResponse(array(
    'message' => 'Error', 
    'form' => $this->renderView('BackendBundle:student:new.html.twig', 
      array(
     'entity' => $entity, 
     'form' => $form->createView(), 
    ))), 400); 

    return $response; 
} 

Если вы могли бы помочь мне лучше понять, как использовать Ajax, чтобы решить эту проблему, я бесконечно благодарен, потому что для многих руководств я видел, я до сих пор не понимаю, это хорошо ,

спасибо, что заранее.

ответ

12

Я могу поделиться с вами специальным решением, которое я использую в старом проекте для управления ошибкой в ​​форме, представленной через вызов ajax.

В действии контроллера:

.... 
if ($request->isXmlHttpRequest()) { 

     if (!$form->isValid()) { 
       return array(
      'result' => 0, 
      'message' => 'Invalid form', 
      'data' => $this->getErrorMessages($form) 
     ); 

      // Do some stuff 
      return array(
      'result' => 1, 
      'message' => 'ok', 
      'data' => '' 
     } 

} 
    // Generate an array contains a key -> value with the errors where the key is the name of the form field 
    protected function getErrorMessages(\Symfony\Component\Form\Form $form) 
    { 
     $errors = array(); 

     foreach ($form->getErrors() as $key => $error) { 
      $errors[] = $error->getMessage(); 
     } 

     foreach ($form->all() as $child) { 
      if (!$child->isValid()) { 
       $errors[$child->getName()] = $this->getErrorMessages($child); 
      } 
     } 

     return $errors; 
    } 

И код JS-то вроде: В стороне клиента:

 $.ajax({ 
      url: ..., 
      data: ...., 
      type: "POST", 
      success: function(data) { 
       if(data.result == 0) { 
        for (var key in data.data) { 
         $(form.find('[name*="'+key+'"]')[0]).before('<ul class="errors"><li>'+data.data[key]+'</li></ul>'); 
        } 
       } else { 
       // Submit OK 
       } 
      } 
     }); 

надеюсь, что это поможет

+0

Привет @Matteo, спасибо еще раз за код, он работал отлично получает ошибки при вызове Ajax, но у меня есть проблема на моей форме У меня есть другой встроенный код и он не возвращал поля с ошибками, которые вставляли форму. Вы знаете, как я могу добавить его к ключевой дате массива, который возвращается в вызове? Я показываю два поля формы «Estudent», у которых есть другая встроенная форма «Ответственный» (родители) следующим образом: '- > add ('response1', new PadresType(), array ('label' => 'Mother')) -> add ('ответственный2', новый PadresType(), array ('label' => 'Father')) ' – Joseph

+0

Я прочитал некоторую потребность добавить 'cascade_validation = true' для проверки встроенной формы, но не знал, где разместить. Может быть, что мне нужно проверить? – Joseph

+0

Привет @Matteo, вы можете мне помочь? Я не могу решить свою проблему, проверяя встроенную форму. – Joseph

1

С Symfony 3 и ошибки валидатор, вы можете проанализировать свой запрос Ajax следующим образом:

/** 
    * Create new student (ajax call) 
    * @Method("POST") 
    * @Route("/student/create", name"student_create") 
    * @param Request $request 
    * @return JsonResponse 
    */ 
    public function createAction(Request $request) 
    { 

     $student = new Student(); 
     $form = $this->createForm(CreateStudentType::class, $student); 
     $form->handleRequest($request); 
     $errors = array(); 

     if ($form->isSubmitted()) { 
      $validator = $this->get('validator'); 
      $errorsValidator = $validator->validate($student); 

      foreach ($errorsValidator as $error) { 
       array_push($errors, $error->getMessage()); 
      } 


      if (count($errors) == 0) { 
       $em = $this->getDoctrine()->getManager(); 
       $em->persist($student); 
       $em->flush(); 

       return new JsonResponse(array(
        'code' => 200, 
        'message' => 'student toegevoegd', 
        'errors' => array('errors' => array(''))), 
        200); 
      } 

     } 

     return new JsonResponse(array(
      'code' => 400, 
      'message' => 'error', 
      'errors' => array('errors' => $errors)), 
      400); 
    } 

И JQuery Ajax

$("#createForm").submit(function(e) { 

     e.preventDefault(); 
     var formSerialize = $(this).serialize(); 

     var url = location.origin + '/web/app_dev.php/student/create'; 
     $.ajax({ 
      type: "POST", 
      url: url, 
      data: formSerialize, 
      success: function (result) { 
       console.log(result); 
       if (result.code === 200) { 
        // refresh current url to see student 
       } else { 

       } 
      } 
     }); 
    }); 
Смежные вопросы