所以我有这个HTML表格。
<html>
<head><title>test</title></head>
<body>
<form action="myurl" method="POST" name="myForm">
<p><label for="first_name">First Name:</label>
<input type="text" name="first_name" id="fname"></p>
<p><label for="last_name">Last Name:</label>
<input type="text" name="last_name" id="lname"></p>
<input value="Submit" type="submit" onclick="submitform()">
</form>
</body>
</html>
当用户点击提交时,哪种方法最容易将这个表单的数据作为JSON对象发送到我的服务器?
更新一下。 我已经走到了这一步,但似乎并不奏效。
<script type="text/javascript">
function submitform(){
alert("Sending Json");
var xhr = new XMLHttpRequest();
xhr.open(form.method, form.action, true);
xhr.setRequestHeader('Content-Type', 'application/json; charset=UTF-8');
var j = {
"first_name":"binchen",
"last_name":"heris",
};
xhr.send(JSON.stringify(j));
我做错了什么?
获取完整的表单数据作为数组,并对其进行json字符串化。
var formData = JSON.stringify($("#myForm").serializeArray());
你可以稍后在ajax中使用它。或者,如果你不使用ajax;把它放在隐藏的textarea中并传递给服务器。如果这些数据是通过正常的表单数据以json字符串形式传递的,那么你必须使用json_decode对其进行解码。然后你会在一个数组中得到所有的数据。
$.ajax({
type: "POST",
url: "serverUrl",
data: formData,
success: function(){},
dataType: "json",
contentType : "application/json"
});
HTML没有提供从表单数据生成JSON的方法。
如果你真的想从客户端处理它,那么你将不得不使用JavaScript来处理。
1.通过DOM从表单中收集你的数据 2.将其组织在一个对象或数组中 3. 用JSON.stringify生成JSON。 4.用XMLHttpRequest发送。
你最好坚持使用application/x-www-form-urlencoded
数据,并在服务器上处理,而不是JSON。你的表单没有任何复杂的层次结构,不会从JSON数据结构中受益。
针对问题的重大改写而更新...
readystatechange
处理程序,所以你对响应不做任何处理