2015-12-03 12 views
10

私はsymfonyを使ってフォームからデータを保存する必要があります。これは、ajaxによってブラウザを更新しないように呼びます。また、フィールドのエラーが発生した場合には、Ajaxの呼び出しに応答してフォームを表示し、フォームのエラーを表示することができます。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を使い始めています。使用方法はわかりません。あなたは、私は永遠に感謝し、私はこの問題を解決するための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; 
} 

:それから私は私が意味するコードを置きます。

ありがとうございます。

答えて

12

私は古いプロジェクトでajax呼び出しによって送信されたフォームのエラーを管理するために使用するカスタムソリューションをあなたと共有できます。コントローラのアクションで

:symfonyの3とエラーでこのヘルプ

+0

こんにちは@Matteoは、コードのために非常にありがとうございました、それは完全にAJAX呼び出しでエラーが発生してきましたが、私は別の埋め込みコードを持っている私のフォーム上の問題を抱えていますフォームに埋め込まれたエラーのあるフィールドは返されませんでした。コールで返された配列のキー日付にどのように追加することができるのか分かりますか?このように 'Responsible'(parents)という組み込み形式の' Estudent'の2つのフィールドを表示します: ' - ( 'ラベル' => '母')) - > add( 'responsible2'、新しいPadresType()、array( 'label' => 'Father')) 'add '(' responsiblee1 '、新しいPadresType()、array – Joseph

+0

私は埋め込みフォームの検証のために 'cascade_validation = true'を追加する必要があることを読んだことがありますが、どこに配置するのかは分かりません。私はそれを検証する必要があるかもしれませんか? – Joseph

+0

こんにちは@Matteo、あなたは私を助けることができますか?私は自分の問題を解決できない埋め込みフォームを検証する – Joseph

1

 $.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 
       } 
      } 
     }); 

希望:クライアント側で :

.... 
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リクエストを解析できます:

/** 
    * 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 { 

       } 
      } 
     }); 
    }); 
関連する問題