从JSON轻松填充HTML表单

Easily populate HTML forms from JSON

本文关键字：HTML 表单 填充 JSON      更新时间：2023-09-26

我在博客上看到过这种HTML符号，但他们没有提到如何使用它：

<input name="object[property]" value=""/>

它是如何命名的，你如何利用它？我需要模板引擎吗？如果我提供JSON对象，jquery能自动填充表单吗？

注意：我已经看到，当我发布表单时，它为我提供了js对象中所有数据的绑定。我的问题更多的是关于表单本身的初始化。

也许这会有所帮助：http://www.thefutureoftheweb.com/blog/use-arrays-with-html-form-inputs

如果你这样做…

<input type="text" name="object[title]" value="Mr.">
<input type="text" name="object[first_name]" value="First Name">
<input type="text" name="object[last_name]" value="Last Name">

并按原样发送表单，服务器端POST变量将如下所示：

//PHP
echo $_POST[object][title]; // echo "Mr."
echo $_POST[object][first_name]; // echo "First Name"
echo $_POST[object][last_name]; // echo "LastName"

即使您定义了JSON对象，您仍然需要一些东西来用默认值填充表单。（例如模板引擎或直接JS）

var JSON = {
    title: 'Mr.',
    first_name: 'First Name',
    last_name: 'Last Name'
}
for (a in JSON) {
    document.write('<input type="text" name="object[' + a + ']" value="' + JSON[a] + '">')
}​

这是一把小提琴：http://jsfiddle.net/remibreton/2cBQB/1/

用于向服务器发送值数组。例如，如果您有10个名称为"foo[]"的输入，那么在php中，您可以为

的值数组说$_POST['fo']（或分别得到）

当您希望结果作为脚本中的关联数组可用时，您可以使用该格式的find。在PHP中，您就可以访问上面元素的值：$_POST["object"]["property"]。它可用于将相关表单输入（如日期+月份+年份）分组在一起。

相关文章：