[英]How to send similar data in array using JSON and AJAX Post Method using jQuery
HTML CODE HTML代码
<form id="details">
<div>
<input type="text" placeholder="Email ID" id="email"></input>
<input type="text" placeholder="Mobile Number" id="mobile"></input>
</div>
<h5>Data</h5>
<div>
<div>
<input type="text" placeholder="Name" id="name1"></input>
<input type="text" placeholder="Age" id="age1"></input>
</div>
<div>
<input type="text" placeholder="Name" id="name2"></input>
<input type="text" placeholder="Age" id="age2"></input>
</div>
</div>
</form>
JS CODE JS代码
$(document).ready(function() {
$("form").on('submit', function(e) {
// Prepare data
var form = $("form");
var formData = new FormData(document.getElementById("details"));
e.preventDefault();
$.ajax(form.attr('action'), {
type: 'POST',
data: formData,
contentType: false,
cache: false,
processData:false,
dataType: "json",
success: function(result) {
// Success Code
},
error: function(result) {
// Failure Code
},
timeout: 5000,
});
});
});
The codepen link for my code is http://codepen.io/anon/pen/VKzGRG 我的代码的codepen链接为http://codepen.io/anon/pen/VKzGRG
I want to send data like 我想像这样发送数据
{
"email" : "xyz@gmail.com",
"mobile" : "9898989898",
"data" : [
{
"name":"xyz",
"age":45
},
{
"name":"xyz",
"age":45
}
]
}
I tried sending the data using jQuery. 我尝试使用jQuery发送数据。
The problem is that it's sending only one name and age. 问题在于它只发送一个姓名和年龄。
Also, in my project, I'm dynamically adding a Name and Age box using jQuery and a button. 另外,在我的项目中,我正在使用jQuery和一个按钮动态添加“名称和年龄”框。
How can I send the data using AJAX post method using jQuery? 如何使用jQuery使用AJAX发布方法发送数据?
you have missed the name of input that's why data is not posting see the below working code. 您错过了输入的名称,这就是为什么数据未发布的原因,请参见以下工作代码。
//HTML code // HTML代码
<form name="details" action="t.php" id="details">
<div>
<input type="text" name="email" placeholder="Email ID" id="email"></input>
<input type="text" name="mobile" placeholder="Mobile Number" id="mobile"></input>
</div>
<h5>Data</h5>
<div>
<div>
<input type="text" name="data1[]" placeholder="Name" id="name1"></input>
<input type="text" name="data1[]" placeholder="Age" id="age1"></input>
</div>
<div>
<input type="text" name="data2[]" placeholder="Name" id="name2"></input>
<input type="text" name="data2[]" placeholder="Age" id="age2"></input>
</div>
</div>
<input type="submit" value="send">
</form>
//ajax code // ajax代码
$(document).ready(function() {
$("form").on('submit', function(e) {
// Prepare data
var form = $("form");
var formData = new FormData(document.getElementById("details"));
console.log(formData);
e.preventDefault();
$.ajax(form.attr('action'), {
type: 'POST',
data: formData,
contentType: false,
cache: false,
processData:false,
dataType: "json",
success: function(result) {
// Success Code
},
error: function(result) {
// Failure Code
},
timeout: 5000,
});
});
});
To post data with jQuery and Ajax, you can do something like this 要使用jQuery和Ajax发布数据,您可以执行以下操作
var myObj = {
"email" : "xyz@gmail.com",
"mobile" : "9898989898",
"data" : [
{
"name":"xyz",
"age":45
},
{
"name":"xyz",
"age":45
}
]
};
$.post( "test.php", myObj)
.done(function( data ) {
alert( "Data Loaded: " + data );
});
That will post the data and alert the response of the request. 这将发布数据并警告请求的响应。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.