javascript - crud ajax jquery symfony3 无法工作

Question

问题:如何在不刷新页面的情况下验证表单并在模式框中返回验证消息。

我刚刚开始学习 Symfony 3，但在使用 AJAX 添加数据时遇到了麻烦。 我知道如何将模板表单包含在模式框中，但我不知道如何在模式中显示 $form->isValid() 的错误消息并保留它。

new.html.twig

更新:我现在可以在 Controller 中调用方法操作。但是当我验证表单时，我在模式框中没有收到任何验证错误。

<script>
    $(function () {
        $('.withdropdown').dropdown();
        $('.add-company-launch').modal();

        $('#company-form').submit(function(e) {

            var formUrl = "{{ path('monteal_backend_company_ajax') }}";
            var formData = new FormData(this)

            $.ajax({
                url: formUrl,
                type: 'POST',
                data:  formData,
                 contentType: false,
                 cache: false,
                processData: false,
                success: function(data, textStatus, jqXHR)
                {
                    if(data['status'] === 'success'){
                        alert('success');
                    } else {
                        $('#add-company').html(data['html']);
                    }
                },
                error: function(jqXHR, textStatus, errorThrown)
                {
                }
            });

            e.preventDefault();
        });
    })
</script>

{% 结束 block %}

CompanyController.php

更新:我为 AJAX 创建了两种方法， 1. 处理表单的方法。 2.AjaxHandler。

   public function newAction() {

        $company = new Company();

        $form = $this->createForm(CompanyForm::class, $company);

        return $this->render('Admin/Backend/Company/new.html.twig', array(
            'form'=>$form->createView()
        ));
    }

    public function ajaxAction(Request $request) {

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

        $company = new Company();
        $form = $this->createForm(CompanyForm::class, $company);
        $form->handleRequest($request);

        if ($form->isValid()) {

            $em = $this->getDoctrine()->getManager();
            $em->persist($company);
            $em->flush();

            return new JsonResponse(array(
                'status' => 'success'), 200
            );
        }

        $html = $this->renderView("Admin/Backend/Company/new.html.twig", array(
            'form' => $form->createView())
        );

        return new JsonResponse(['status' => 'error', 'html' => $html]);
    }

Answer 1

1 - 在您的 newAction 中，只需创建表单并将 View (createView) 传递给您的模板。

2 - 编写 ajaxFormHandlerAction 并在此处创建表单，处理它，验证它，在变量中渲染 View : $html = $this->renderView('yourTemplate.html.twig', array($form->createView())); 编辑:当然，您的 ajax 必须将表单发布到您新的 ajax url...END 编辑

3 - 如果未验证 返回一个 JsonResponse(array('html' => $html, 'status' => 'error')); 如果经过验证 返回 JsonResponse(array('status' => 'success'));

4 - 在 ajax 成功回调中，如果状态错误，则渲染新表单。 如果状态成功，重定向或其他什么

希望这有帮助

编辑:

你的 Controller 是这样的:

    use Symfony\Component\HttpFoundation\JsonResponse;
    public function ajaxFormHandlerAction(Request $request) 
    {
        $company = getYourCompany(); //get it from db?
        $form = $this->createForm(CompanyForm::class, $company));
        $form ->handleRequest($request);
        if($form ->isValid()){
             //do whatever you want, maybe persist, flush()
             return new JsonResponse(array(
                'status' => 'success'));
        }
        $html = $this->renderView("yourModalTemplate.html.twig", array('form' => $form->createView()));
        return new JsonResponse(['status' => 'error', 'html' => $html]);
     }

并在成功的 ajax 回调中:

success: function(data, textStatus, jqXHR)
{
    if(data['status'] === 'success'){
        alert('success');
        // maybe redirect the user ???
    }else if(data['status' === 'error']){
        $('#idOfYourModal').html(data['html']); //assuming you use jquery, or translate to javascript
    }
},

您必须创建一个仅包含模态框的 Twig 模板...