Symfony форма отправлена ​​с AJAX

Question

Я хочу отправить форму Symfony с помощью AJAX. Я уже сделал это, но я не могу найти ошибку в моем коде. Когда я нажимаю «Отправить», он отправляет форму, но не с AJAX.

Создание формы в контроллере:

$form = $this->createForm(CorrectionReponseQRFormType::class, $passage)->createView(); 

Twig: функция

{{ form_start(form, {'id': 'formCorrection'~reponse.id}) }} 

     {{ form_widget(form.note, {'id': 'note'~reponse.id}) }} 

     {{ form_widget(form.commentaire, {'id': 'commentaire'~reponse.id}) }} 

     {{ form_row(form.submit) }} 
{{ form_end(form) }} 

<script> 
    var note = document.getElementById("note{{ reponse.id }}").value; 
    var idCommentaire = 'commentaire{{ reponse.id }}'; 

    var commentaire = CKEDITOR.instances[idCommentaire].getData(); 
    $("#formCorrection{{ reponse.id }}").submit(function() { 
     $.ajax({ 
      type: "POST", 
      url: "{{ path('paces_colle_correctioncolleqr_sauvegardercorrectionpassage') }}", 
      data: {note: note, commentaire: commentaire, idReponse: {{ reponse.id}}} 
     }) 
    }); 
</script> 

Контроллер:

public function sauvegarderCorrectionPassageAction(Request $request) 
{ 
    if ($request->isXmlHttpRequest()) { 
     $em = $this->getDoctrine()->getManager(); 

     $idReponse = $request->request->get('idReponse'); 
     $reponse = $em->getRepository(ReponseQR::class)->find($idReponse); 
     $note = $request->request->get('note'); 
     $commentaire = $request->request->get('commentaire'); 

     $passerColle = $em->getRepository(PasserColle::class) 
      ->findOneBy(array('colle' => $reponse->getColle()->getId(), 
       'user' => $reponse->getUser()->getId())); 

     $reponse->setCorrigee(true); 
     $passerColle->setNote($note); 
     $passerColle->setCommentaire($commentaire); 
     $em->persist($passerColle); 
     $em->flush(); 

     // Affichage 
     return false; 
    } 
} 

Answer 1

Это Бека кнопку «Отправить» отправьте форму по умолчанию.

Вы можете использовать event.preventDefault()

$("#formCorrection{{ reponse.id }}").submit(function(event) { 
     event.preventDefault(); 
     event.stopPropagation(); 
     $.ajax({ 
      type: "POST", 
      url: "{{ path('paces_colle_correctioncolleqr_sauvegardercorrectionpassage') }}", 
      data: {note: note, commentaire: commentaire, idReponse: {{ reponse.id}}} 
     }) 
    }); 

Answer 2

или вы можете использовать возвращать FALSE; в конце этой функции

$("#formCorrection{{ reponse.id }}").submit(function(event) { 
     $.ajax({ 
      type: "POST", 
      url: "{{ path('paces_colle_correctioncolleqr_sauvegardercorrectionpassage') }}", 
      data: {note: note, commentaire: commentaire, idReponse: {{ reponse.id}}} 
     }); 
     return false; 
});