Question

我有一个简单的HTML表单，它收集了四个不同的值。我想将收集的数据以JSON格式发布到API服务器。

<body>
<h2>Form</h2>

<form action="/endpoints" method="post" onsubmit="return profile();">

MAC Address:<input type="text" id="mac" name="mac" size="12"/> 

<br/>Select Catagory:<br/>
<select name="catagory" id="catagory">
<option value="SmartDevice">SmartDevice</option>
<option value="Printer">Printer</option>
<option value="Printer">Printer</option>
</select>
<br/>Select Family:<br/>
<select name="family" id="family">
<option value="Android">Android</option>
<option value="Ricoh">Ricoh</option>
<option value="Canon">Canon</option>
</select>
<br/>Name:<br/>
<select name="name" id="name">
<option value="Android">Android</option>
<option value="Ricoh Multifunction Printer">Ricoh Multifunction Printer</option>
<option value="Canon Printer">Canon Printer</option>
</select>


<input type="submit" style="width: 200px;" id="submit" onclick="return profile();">

<script type="text/javascript">
{literal}
function profile (){
var addr = document.getElementsByName("mac")[0].value;
var str_array = addr.split(',');
var nam = document.getElementsByName("name")[0].value;
var famil = document.getElementsByName("family")[0].value;
var catagor = document.getElementsByName("catagory")[0].value;
for(var i = 0; i < str_array.length; i++) {
   str_array[i] = str_array[i].replace(/^\s*/, "").replace(/\s*$/, "");
   var output = '[' + JSON.stringify({mac: str_array[i], device: {category: catagor, family: famil, name: nam}}) + ']';
};
return output;
}
{/literal}
</script>
</form>
</body>

如果我调用profile（），我可以获得所需的JSON输出;在控制台中。但是，发布数据与单行中的所有值不同。

我希望帖子数据如下：

[{"mac": "aabbccddeeff", "device": {"category": "Printer", "family": "Xerox", "name": "Xerox WorkCenter"}},
 {"mac": "bbccddeeffaa", "device": {"category": "Printer", "family": "Xerox", "name": "Xerox WorkCenter"}},
 {"mac": "ccddeeffaabb", "device": {"category": "Printer", "family": "Xerox", "name": "Xerox WorkCenter"}}]'

请帮帮我，我是新手。： - ）

Answer 1

首先构造一个output，它是一个数组。然后使用JSON.strigify将其转换为JSON blob，这将成为ajax调用的一部分。

此外，您无法返回作为表单元素一部分的已修改数据，您需要求助于从JS进行显式ajax调用。

在没有ajax

1 个答案: