首页 > 解决方案 > Symfony Form FileType 通过 AJAX:验证错误 isSubmitted() 总是 false with processData: false

问题描述

我过去已经完成了文件上传,AJAX JQUERY但现在我正在尝试对 symfony 做同样的事情FileType

问题是在正常的工作流程中我们需要添加contentType: false, processData: false,,但这似乎会导致以下 symfony 错误:Cannot check if an unsubmitted form is valid. Call Form::isSubmitted() before Form::isValid().

所以isSubmitted()总是假的,我猜是因为processData: false

我完全不知道如何解决这个问题,因为如果我不这样做contentType: false,AJAX 请求就会崩溃。symfony 文档对此没有内容。

JAVASCRIPT:

const form_data = $('#newBrandForm').serializeArray();
const json = serializeAsObject(form_data)

    const files = document.getElementById('new_brand_group_logo_logoFile').files;

    if (files.length > 0) {

        let formData = new FormData();

        for (let x = 0; x < files.length; x++) {
            formData.append("attachements", files[x]);
        }

        json['new_brand[group_logo][logoFile]'] = formData

    }

    $.ajax({
        url: `/new-brand-form-handle`,
        type: 'POST',
        cache: false,
        contentType: false,
        processData: false,
        data: json
    })

控制器

function brandFormHandle(Request $request) {

    $em = $this->getDoctrine()->getManager();

    $brandEntity = new Brand();

    // create form
    $form = $this->createForm(NewBrandType::class, $brandEntity);

    // handle
    $form->handleRequest($request); // CRASH HERE

    if ($form->isSubmitted() && $form->isValid()) { 

        $brand = $form->getData();

        // move file
        $someNewFilename = 'newBrand'.'-logo';
        $file = $form['attachment']->getData();
        $file->move($this->directory, $someNewFilename);

        try {

            $em->persist($brand);
            $em->flush();

            $status = 'Brand added';

        } catch (Exception $ex) {
            return $this->json([2, 'insertion error'.$ex]);
        }
        return $this->json([1, $status]);
    }

 //....

}

$requestDUMP 所以我可以看到那里的文件,但看起来表单只是一个对象,所以我不确定这是否是问题所在?

Request {#51 ▼
+attributes: ParameterBag {#71 ▶}
+request: ParameterBag {#87 ▼
#parameters: array:1 [▼
  "form" => "[object Object]"
]
}
+query: ParameterBag {#70 ▶}
+server: ServerBag {#35 ▶}
+files: FileBag {#73 ▶}
+cookies: ParameterBag {#72 ▶}
+headers: HeaderBag {#82 ▶}
#content: null
#languages: null
#charsets: null
#encodings: null
#acceptableContentTypes: null
#pathInfo: "/new-brand-form-handle"
#requestUri: "/new-brand-form-handle"
#baseUrl: ""
#basePath: null
#method: "POST"
#format: null
#session: Closure {#111 ▶}
#locale: null
#defaultLocale: "en"
-isHostValid: true
-isForwardedValid: true
basePath: ""
format: "html"
}

// 这是来自 console.log(json) 的转储,注意没有文件;我不确定这是否正常

Object
 new_brand[group_description][description]: "description"
 new_brand[group_identification][city]: ""
 new_brand[group_identification][country]: "AU"
 new_brand[group_identification][name]: "name"
 new_brand[group_identification][postcode]: ""
 new_brand[group_identification][streetAdd]: ""
 new_brand[group_identification][street]: "street"
 new_brand[group_identification][website]: "website"
 new_brand[group_logo][logoURL]: "web" 

标签: jqueryajaxsymfonysymfony-forms

解决方案


我不知道您为什么要混合使用不同的方法(将 serializeArray 与 FormData 一起使用),并且不要只坚持使用 FormData。

您似乎在 ajax 请求中将格式错误的 json 对象作为数据传递,因为字段 json['new_brand[group_logo][logoFile]'] 包含 formData,因此它不是有效的 json 对象。

事实上,如果你使用 twig 来渲染你的表单(我猜你会这样做),你所要做的就是:

var form = $('#newBrandForm')[0]; // You need to use standard javascript object here
var formData = new FormData(form);

$.ajax({
    url: `/new-brand-form-handle`,
    type: 'POST',
    cache: false,
    contentType: false,
    processData: false,
    data: formData
});

现在您应该在控制器中正确提交表单。


推荐阅读