Symfony3 - 生成されたフォーム

Question

を使ってAjaxでデータを追加それでは、私がやったことは、私はJSONでビューを返し、その後、指定されたクラスのエンティティのparam上にformType塩基を発生し、それがここにAJAX で細かい作業だが、コントローラでの目標経路である：

新しいボタンをモーダルポップアップを追加して、HTMLでそれを埋めるクリックした後

/** 
    * @Route("/{action}/{class}/{pk}", 
    * name="manage", 
    * defaults={"pk": "-1"}, 
    * options={"expose": "true"}, 
    *  requirements={ 
    *   "action": "^(ajouter|modifier|supprimer)$"} 
    *) 
    */ 
    public function manageAction($action, $class, $pk, Request $request) { 

     if ($request->isXmlHttpRequest()) { 
      $entityPath = 'PlatformBundle\Entity\\' . $class; 
      $formTypePath = 'PlatformBundle\Form\\' . $class . 'Type'; 
      $twigformview = strtolower($class) . "form.html.twig"; 


      if ($action == 'ajouter') { 
       $obj = new $entityPath; 
      } else { 
       $obj = $this->getDoctrine()->getRepository('PlatformBundle:' . $class)->find($pk); 
      } 

      $form = $this->createForm($formTypePath, $obj); 

      $form->handleRequest($request); 
      if ($form->isSubmitted() && $form->isValid()) { 
       $obj = $form->getData(); 
       $em = $this->getDoctrine()->getManager(); 
       try { 
        if ($obj) { 
         if ($action == 'supprimer') { 
          $em->remove($obj); 
          $em->flush(); 
         } else { 
          $em->persist($obj); 
          $em->flush(); 
          return new JsonResponse(array('respond' => 'true')); 
         } 
        } 
       } catch (Exception $ex) { 
        return new JsonResponse(array('respond' => 'false')); 
       } 
      } 

      $myHtmlText = $this->renderView('PlatformBundle:Gestion:' . $twigformview, array(
       'form' => $form->createView(), 
       'table' => $class, 
       'action' => $action 
      )); 

      $response = new JsonResponse(); 
      $response->setData(array('entity' => $class, 'action' => $action, 'htmltext' => $myHtmlText)); 
      return $response; 
     } 
    } 

が返さ：すべてが素晴らしいですが、私はボタンをクリックすると、モーダル何で追加

$('#addButton').click(function() { 

     $.ajax({ 
      type: 'post', 
      url: Routing.generate('manage', {action: 'ajouter', class: 'Fournisseur'}), 
      beforeSend: function() { 
       $('#modalTitle').html("Chargement..."); 
       $('#modalBody').html('<div><p align="center"><img src="../../assets/img/loading-circle.gif" with="80" height="80"></p>\n\ 
              <p align="center">Création du formulaire en cours...</p></div>'); 
       $('#gesModal').modal('show'); 
      }, 
      success: function (data) { 

       $('#modalTitle').html(data.action + " " + data.entity); 
       $('#modalBody').html(data.htmltext); 
      }, 
     }); 
    }); 

ここまで行われます

/* ---------- Ajout ---------- */ 
    $('#ajouterFournisseur').click(function() { 
     $.ajax({ 
      type: 'post', 
      url: Routing.generate('manage', 
            {action: 'ajouter', class: 'Fournisseur', fournisseur: { 
             libellef: $('#fournisseur_libellef').val(), 
             emailf: $('#fournisseur_emailf').val(), 
             telf: $('#fournisseur_telf').val(), 
             adressef: $('#fournisseur_adressef').val(), 
             codeEntreprise: $('#fournisseur_codeEntreprise').val(), 
             _token: $('#fournisseur__token').val() } 
            }), 
      async: true, 
      dataType: "json", 
      success: function (data) { 
       console.log(data); 
      }, 
     }); 
    }); 

や詳細については、このビューコードです：

{{ form_start(form, { 'attr': {'class': 'form-horizontal'} }) }} 



       {{ form_widget(form.libellef, { 'attr': {'class': 'form-control', 
                'autofocus': ''} }) }} 

        {{ form_widget(form.emailf, { 'attr': {'class': 'form-control', 
                'placeholder': 'nom@domaine.ex', 
                'type-data': 'email'} }) }} 

        {{ form_widget(form.telf, { 'attr': {'class': 'form-control tel', 
                'type-data': 'tel'} }) }} 

        {{ form_widget(form.adressef, { 'attr': {'class': 'form-control'} }) }} 

        {{ form_widget(form.codeEntreprise, { 'attr': {'class': 'form-control', 
                'type-data': 'codeEntreprise'} }) }} 

     <button type="button" id="{{ action ~ table }}" class="btn btn-primary">{{ action }}</button> 
     {% if action != 'supprimer' %} 
      <button type="reset" class="btn btn-inverse">vider</button> 
     {% endif %} 

    {{ form_end(form) }} 

私はこの2日間でこだわっている今、多くのことを検索してみたが、常に私は同じ問題を抱えてありがとう！

Answer 1

私はjavascriptの側のソリューションは、Ajaxが提出フォームにリクエストを送信することに変更しました：

$('form[name="fournisseur"]').on('submit', function (e) { 
     e.preventDefault(); 
     $.ajax({ 
      url: Routing.generate('manage', {action: 'ajouter', class: 'Fournisseur'}), 
      type: "POST", 
      data: $(this).serialize(), 
      beforeSend: function() { 
       $('#alertMessage').html('<img src="../../assets/img/loading-circle.gif" with="30" height="30"> En cours ...'); 
      }, 
      success: function (data) { 
       console.log(data); 
       if(data.respond == 'true'){ 
       $('#alertMessage').addClass("alert alert-success"); 
       $('#alertMessage').html('<button type="button" class="close" data-dismiss="alert">×</button>\n\ 
       <strong>Ajout</strong> Opération effectuer avec succée.'); 
       } 
      }, 
      error: function (jXHR, textStatus, errorThrown) { 
       alert(errorThrown); 
      } 
     }); 
    });