form通过ajax提交表单,Jquery通过Ajax方式来提交Form表单
今天刚好看到Jquery的ajax提交数据到服务器的方法,原文是:
保存数据到服务器，成功时显示信息。
jQuery 代码:
$.ajax({
type: "POST",
url: "some.php",
data: "name=John&location=Boston",
success: function(msg){
alert( "Data Saved: " + msg );
}
});
后来我就想了一下,我要提交form表单有没有办法呢?但是我不可能每个fom的input都写一次var demo=$("#divname").val();的.
后来,今天我看到一个方法,就是.map,就做出一下想法了,可以借鉴哟;
html代码如下,下面我要提交Form 的id为dlg_form的所有input数据,
房间:
建筑:
部门:
空调控制器
端口:
地址:
工作方式:
是否启用:
灯光控制器
端口:
地址:
工作方式:
是否启用:
安装了总表:
总表电能节点:
是不是很多,如果要你每个input都写的话,是不是要吐血?
看看我的方法,首先我们把所有的input的name和value都取下来,
js代码如下:
var str_data=$("#dlg_form input").map(function(){
return ($(this).attr("name")+'='+$(this).val());
}).get().join("&") ;
alert(data);
ps:你alert一下,你会发现,这里面的架构就是divname=xxx&divname2=xxxx等等,
然后在回头看看ajax提交的:
$.ajax({
type: "POST",
url: "some.php",
data: "name=John&location=Boston",
success: function(msg){
alert( "Data Saved: " + msg );
}
});
有没有发现,只要我们把我们上面获取到的,放到data里面就可以了?
完整的代码,修改后应该是
$.ajax({
var str_data=$("#dlg_form input").map(function(){
return ($(this).attr("name")+'='+$(this).val());
}).get().join("&") ;
type: "POST",
url: "some.php",
data: str_data,
success: function(msg){
alert( "Data Saved: " + msg );
}
});
ok,就这么简单,如果适用的话,可以拿去用哟...
呵呵.
如果有问题,也欢迎提出来.
通过jQuery的Ajax方式来提交Form表单
通过jQuery的Ajax方式来提交Form表单 $.ajax({ url:ajaxCallUrl, type:"POST", cache:true, async:false, d ...
导出excel用ajax不行，提交form表单可以
导出excel用ajax不行,提交form表单可以. 一直用ajax找原因,网页不出现下载提示框 写了 response.setContentType("application/binary ...
DEDE使用AJAX无刷新提交Form表单，PHP返回结果
$query = "INSERT INTO `{$diy->table}` (`id`, `ifcheck` $addvar) VALUES (NULL, 0 $addvalue); ...
jquery ajax方式直接提交整个表单
$.ajax({ type: "POST", url: url, data: $('#form1').serialize(), success: function(msg){ al ...
jquery的ajax提交form表单方式总结
方法一: function AddHandlingFeeToRefund() { var AjaxURL= "../OrderManagement/AjaxModifyOrderServic ...
jquery实现ajax提交form表单的方法总结
本篇文章主要是对jquery实现ajax提交form表单的方法进行了总结介绍,需要的朋友可以过来参考下,希望对大家有所帮助 方法一: function AddHandlingFeeToRefund( ...
Ajax提交form表单内容和文件(jQuery.form.js)
jQuery官网是这样介绍form.js A simple way to AJAX-ify any form on your page; with file upload and progress s ...
jquery实现ajax提交form表单的方法总结(转)
方法一: 复制代码 代码如下: function AddHandlingFeeToRefund() { var AjaxURL= "../OrderManagement ...
随机推荐
使用SFTP工具下载文件
1. 打开SFTP会话 File->Connect SFTP Session 2. cd 到文件目录下 3. get 文件名称 sftp> get catalina.out 4. lpw ...
as3 Point
首先我们看看Point类的属性:x:Number——该点的水平坐标y:Number——该点的垂直坐标length:Number——从(0,0)到此点的线段长度(只读属性)从length属性我们可以看到 ...
zw版【转发·台湾nvp系列Delphi例程】HALCON FillUpShape1
zw版[转发·台湾nvp系列Delphi例程]HALCON FillUpShape1 procedure TForm1.Button1Click(Sender: TObject);var img : ...
Codeforces Round #326 (Div. 2) D. Duff in Beach dp
D. Duff in Beach Time Limit: 1 Sec Memory Limit: 256 MB 题目连接 http://codeforces.com/contest/588/probl ...
Hibeernate中的两种分页方式
1. return getHibernateTemplate().executeFind(new HibernateCallback() { public Object doInHibernate(S ...
matlab练习程序(曲面拟合)
这里用到的还是最小二乘方法,和上一次这篇文章原理差不多. 就是首先构造最小二乘函数,然后对每一个系数计算偏导,构造矩阵乘法形式,最后解方程组. 比如有一个二次曲面:z=ax^2+by^2+cxy+dx ...
struts2之配置文件struts.xml详解
struts配置文件 struts.xml配置参数详解 struts.xml中很大一部分配置默认配置就好了 但是有些还是需要做了解 以便于理解 和修改 <?xml version=" ...
LeetCode: Pow(x, n) 解题报告
Pow(x, n) Implement pow(x, n). SOLUTION 1: 使用二分法. 1. 负数的情况,使用以下的公式转化为求正数power,另外,考虑到MIN_VALUE可能会造成越界 ...
TreeCollection2
Tree Collection 2 Table of Contents Introduction Structure Interfaces Data Node structure Tree struc ...