将 Symfony 表单数据序列化为 JSON答案

【问题标题】：Serialize Symfony form data to JSON将 Symfony 表单数据序列化为 JSON
【发布时间】：2021-08-29 14:01:24
【问题描述】：

使用Symfony Forms，生成的HTML如下所示：

<input type="text" id="form_name" name="form[name]">
<input type="email" id="form_email" name="form[email]">
<textarea id="form_message" name="form[message]"></textarea>

使用一点 JS 将条目转换为 JSON 并提交：

const contactForm = document.getElementById('contact-form');

contactForm.addEventListener('submit', (event) => {
  event.preventDefault();
  const formData = new FormData(event.target);
  const jsonData = JSON.stringify(Object.fromEntries(formData));

  // handle submission... 
})

JSON 发送到后端：

"{"form[name]":"John Doe","form[email]":"example@domain.com","form[message]":"Some message"}"

在我的控制器中（在 PHP 中）我将数据序列化为一个数组：$data = json_decode($request->getContent()); 问题是该数据的格式（如预期）如下：

["form[name]" => "John Doe", "form[email]" => "example@domain.com", "form[message]" => "Some message"];

有没有内置的方法可以得到下面的结果（无论是PHP还是JS）？

[ "name" => "John Doe", "email" => "example@domain.com", "message" => "Some message" ];

我研究过使用Serializer Component 没有成功，现在想知道我是否遗漏了什么，或者是否应该在提交之前在 JS 中修复数据。可能有内置解决方案吗？

【问题讨论】：

标签： javascript php symfony

【解决方案1】：

如果我没记错的话，您是使用 AJAX 提交的。并且您可以在 AJAX API 请求中直接将 FormData 对象指定为主体。在后端，您将根据您的请求方法在 $_POST 或 $_GET 数组中接收数据。

这是示例代码。

const contactForm = document.getElementById('contact-form');

contactForm.addEventListener('submit', (event) => {
  event.preventDefault();
  const formData = new FormData(event.target);
  fetch('<AJAX API URL>', {
        method: 'POST',
        body: formData
    }).then(function (response) {
        if (response.ok) {
            return response.json();
        }
        return Promise.reject(response);
    }).then(function (data) {
        console.log(data);
    }).catch(function (error) {
        console.warn(error);
    }); 
})

<form id="contact-form">
  <input type="text" name="form['name']" />
  <input type="text" name="form['job']" />
  <input type="submit" value="submit" />
</form>

以下是您将如何在 POST 数组中获取数据。

Array
(
    [form] => Array
        (
            ['name'] => 123
            ['job'] => 123123
        )

)

【讨论】：