jQuery AJAX提交表单
我有一个名为orderproductForm的表单和一个未定义数量的输入。
我想做一些jQuery.get或ajax或类似于通过Ajax调用页面的东西，并发送orderproductForm形式的所有输入。
我想有一种方法是做类似的事情
jQuery.get("myurl",
{action : document.orderproductForm.action.value,
cartproductid : document.orderproductForm.cartproductid.value,
productid : document.orderproductForm.productid.value,
...
但是我不知道所有的表单输入。 是否有一个功能，功能或者只是发送所有表单输入？
您可以使用Ajax Form Plugin或jQuery序列化函数中的ajaxForm / ajaxSubmit函数。
AjaxForm ：
$("#theForm").ajaxForm({url: 'server.php', type: 'post'})
要么
$("#theForm").ajaxSubmit({url: 'server.php', type: 'post'})
当提交按钮被按下时，ajaxForm会发送。 ajaxSubmit立即发送。
序列化 ：
$.get('server.php?' + $('#theForm').serialize())
$.post('server.php', $('#theForm').serialize())
AJAX序列化文档在这里。
这是一个简单的参考：
// this is the id of the form
$("#idForm").submit(function(e) {
var url = "path/to/your/script.php"; // the script where you handle the form input.
$.ajax({
type: "POST",
url: url,
data: $("#idForm").serialize(), // serializes the form's elements.
success: function(data)
{
alert(data); // show response from the php script.
}
});
e.preventDefault(); // avoid to execute the actual submit of the form.
});
我希望它能帮助你。
使用表单元素上定义的属性的另一个类似的解
<form id="contactForm1" action="/your_url" method="post">
<!-- Form input fields here (do not forget your name attributes). -->
</form>
<script type="text/javascript">
var frm = $('#contactForm1');
frm.submit(function (e) {
e.preventDefault();
$.ajax({
type: frm.attr('method'),
url: frm.attr('action'),
data: frm.serialize(),
success: function (data) {
console.log('Submission was successful.');
console.log(data);
},
error: function (data) {
console.log('An error occurred.');
console.log(data);
},
});
});
</script>