提交表格ajax symfony

我想用ajax和symfony保存一个实体。但总是出现错误。这是我的代码提交表格ajax symfony

<form id="form" class="full_form" {{form_enctype(form)}} action="{{ path('add_contact') }}" method="post" > 
<div class="left small_width"> 

    <div class="section-title">Ajout d'un contact</div> 
    <span>Les champs suivis d’une étoile sont obligatoires</span> 
    {{ form_widget(form.name,{ 'attr': {'maxlength': '50','placeholder':'placeholder.nom'|trans} }) }} 
    {{ form_widget(form.lastName, { 'attr': {'maxlength': '50','placeholder':'placeholder.prenom'|trans} }) }} 
    {{ form_widget(form.countryId,{ 'attr': {'maxlength': '50','placeholder':'placeholder.contact.country'|trans} }) }} 
    {{ form_widget(form.gsmPrimary, { 'attr': {'maxlength': '50','placeholder':'placeholder.contact.gsmPrimary'|trans} }) }} 
    {{ form_widget(form.gsmSecondary, { 'attr': {'maxlength': '50','placeholder':'placeholder.contact.gsmSecondary'|trans} }) }} 
    {{ form_widget(form.landlinePrimary, { 'attr': {'maxlength': '50','placeholder':'placeholder.contact.landlinePrimary'|trans} }) }} 
    {{ form_widget(form.landlineSecondary, { 'attr': {'maxlength': '50','placeholder':'placeholder.contact.landlineSecondary'|trans} }) }} 
    {{ form_widget(form.faxPrimary, { 'attr': {'maxlength': '50','placeholder':'placeholder.contact.faxPrimary'|trans} }) }} 
    {{ form_widget(form.faxSecondary, { 'attr': {'maxlength': '50','placeholder':'placeholder.contact.faxSecondary'|trans} }) }} 
    {{ form_widget(form.streetNumber) }}

在我的Java脚本代码

：

<script> 
    initAjaxForm(); 
</script>

在我main.js

 function initAjaxForm() 
    { 
     $('body').on('submit','full_form',function(e) { 


e.preventDefault(); 

     $.ajax({ 
      type: $(this).attr('method'), 
      url: $(this).attr('action'), 
      data: $(this).serialize() 
     }) 
      .done(function (data) { 
       if (typeof data.message !== 'undefined') { 
        alert(data.message); 
       } 
      }) 
      .fail(function (jqXHR, textStatus, errorThrown) { 
       if (typeof jqXHR.responseJSON !== 'undefined') { 
        if (jqXHR.responseJSON.hasOwnProperty('form')) { 
         $('#form_body').html(jqXHR.responseJSON.form); 
        } 

        $('.form_error').html(jqXHR.responseJSON.message); 

       } else { 
        alert(errorThrown); 
       } 

      }); 

    }); 
}

终于在我的控制器。创建操作如下所示。

public function createAction(Request $request) 
    { 

if (!$request->isXmlHttpRequest()) { 
    return new JsonResponse(array('message' => 'You can access this only using Ajax!'), 400); 
} 
     $contact = new Contact(); 
     $form = $this->createForm(new ContactType(), $contact); 


     $form->handleRequest($request); 

     if ($form->isValid()) { 
      $em = $this->getDoctrine()->getManager(); 
       $em->persist($contact); 
      // $em->persist($label); 
      $em->flush(); 
      return new JsonResponse(array('message' => 'Success!'), 200); 

     } 
    $response = new JsonResponse(
      array(
       'message' => 'Error', 
       'form' => $this->renderView('MyBundle:Contact:new.html.twig', 
        array(
         'entity' => $contact, 
         'form' => $form->createView(), 
         'form2' => $form2->createView() 
        ))), 400); 

     return $response;

但我总是遇到一个错误，“只能用ajax访问它”。

有没有人向我们展示如何使用ajax发送表单。我尝试了两个在网上找到的例子，但总是一样的结果。

来源

2015-10-09 Majdi Taleb

看起来像你的JavaScript代码没有运行。检查控制台上的JavaScript错误，如Firebug的一个或任何类似的工具。例如，我在$（'body'）中看到一个拼写错误。（'submit'，'full_form'，function（e）{，忘记在“full_form”之前添加一个“。”。 – viktor77

可以使用ajaxSubmit提交您的形式是这样的：

$('input[type="submit"]').click(function() { 
    $('#form').submit(function(e){ 
     e.preventDefault(); 
     $(this).ajaxSubmit(
     { 
      url: "{{ path('add_contact') }}", 
      type: "POST", 
      success: function (result) 
      { 
       $('#form_body').html(result); 
      } 
     }); 
    }); 
});

，或者您也可以提交您的形式是这样的：

$('input[type="submit"]').click(function() { 
     $('#form').submit(function(e){ 
      e.preventDefault(); 
      $.ajax(
      { 
       url: "{{ path('add_contact') }}", 
       type: "POST", 
       data: $('#form').serialize(), 
       success: function (result) 
       { 
        $('#form_body').html(result); 
       } 
      }); 
     }); 
    });

希望帮助

来源

2015-10-09 16:39:19 Soufiene

我会测试它，谢谢你非常 –

$('body').on('submit','.full_form',function(e) { ... }

full_form应以点为前缀。

但尝试测试您的javascript脚本是否像viktor77提议给您一样运行。

来源

2015-10-09 19:19:57 user254319

提交表格ajax symfony

回答

相关问题