jquery实现ajax提交form表单的方法总结


Posted in Javascript onMarch 03, 2014

方法一:

function AddHandlingFeeToRefund()
        {
            var AjaxURL= "../OrderManagement/AjaxModifyOrderService.aspx";       
            alert($('#formAddHandlingFee').serialize());
                $.ajax({
                    type: "POST",
                    dataType: "html",
                    url: AjaxURL + '?Action=' + 'SubmitHandlingFee' + '&OrderNumber=' + $.trim($("#<%=this.txtOrderNumber.ClientID %>").val()),
                    data: $('#formAddHandlingFee').serialize(),
                    success: function (result) {
                        var strresult=result;
                        alert(strresult);
                        //加载最大可退金额
                        $("#spanMaxAmount").html(strresult);
                    },
                    error: function(data) {
                        alert("error:"+data.responseText);
                     }
                });
        }

方法二:
        //ajax提交form表单的方式
        $('#formAddHandlingFee').submit(function() {
            var AjaxURL= "../OrderManagement/AjaxModifyOrderService.aspx";       
            alert($('#formAddHandlingFee').serialize());
                $.ajax({
                    type: "POST",
                    dataType: "html",
                    url: AjaxURL + '?Action=' + 'SubmitHandlingFee' + '&OrderNumber=' + $.trim($("#<%=this.txtOrderNumber.ClientID %>").val()),
                    data: $('#formAddHandlingFee').serialize(),
                    success: function (data) {
                        var strresult=data;
                        alert(strresult);
                        //加载最大可退金额
                        $("#spanMaxAmount").html(strresult);
                    },
                    error: function(data) {
                        alert("error:"+data.responseText);
                     }
                });
        }
    );

页面html代码:
                  <form id="formAddHandlingFee" name="formAddHandlingFee" enctype="multipart/form-data" onsubmit="AddHandlingFeeToRefund()">
                    <table id="AddHandlingFee" class="Wfill">
                        <tr>
                            <td>
                                <asp:Literal ID="UI_Amount" runat="server" Text="处理费用" meta:resourcekey="HandlingFeeAmount" />
                            </td>
                            <td>
                                <input type="text" id="txtHandlingFeeAmount" name="txtHandlingFeeAmount"  class="{required:true,number:true}" maxlength="12" />
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <asp:Literal ID="UI_HandlingFeeType" runat="server" Text="费用类型" meta:resourcekey="HandlingFeeHandlingFeeType" />
                            </td>
                            <td>
                                <crmweb:HtmlSelectControl ID="HandlingFeeType" EnumTypeName="DX.OMS.Model.Common.HandlingFeeType,DX.OMS.Model.Common" EmptyValue="" EmptyText="Select" runat="server" class="text {required:true}"/>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <asp:Literal ID="UI_Notes" runat="server" Text="备注" meta:resourcekey="HandlingFeeNotes" />
                            </td>
                            <td>
                                <textarea id="txtNotes" name="txtNotes" class="text {required:true}" cols="22" rows="2" maxlength="100"></textarea>
                            </td>
                        </tr>                        <tr>
                            <td>
                            </td>
                            <td>
                                <input id="Submit1" type="submit" value="添加处理费"  />
                                <asp:Button ID="Button1"  runat="server" Text="添加处理费" OnClientClick="javascript:AddHandlingFeeToRefund()" />
                            </td>
                        </tr>
                    </table>
                    </form>
Javascript 相关文章推荐
脚本安需导入(装载)的三种模式的对比
Jun 24 Javascript
js函数的延迟加载实现代码
Oct 11 Javascript
css配合jquery美化 select
Nov 29 Javascript
javascript中数组的sort()方法的使用介绍
Dec 18 Javascript
javascript里绝对用的上的字符分割函数总结
Jul 31 Javascript
jQuery中live()方法用法实例
Jan 19 Javascript
javascript实现十秒钟后注册按钮可点击的方法
May 13 Javascript
javascript从定义到执行 你不知道的那些事
Jan 04 Javascript
js基本算法:冒泡排序,二分查找的简单实例
Oct 08 Javascript
Sublime Text新建.vue模板并高亮(图文教程)
Oct 26 Javascript
谈谈vue中mixin的一点理解
Dec 12 Javascript
如何使用JavaScript实现栈与队列
Jun 24 Javascript
SeaJS入门教程系列之SeaJS介绍(一)
Mar 03 #Javascript
js的hasownproperty使用示例
Mar 02 #Javascript
javascript对象的使用和属性操作示例详解
Mar 02 #Javascript
使用js显示当前时间示例
Mar 02 #Javascript
jquery实现背景墙聚光灯效果示例分享
Mar 02 #Javascript
jquery制作弹窗提示窗口代码分享
Mar 02 #Javascript
jquery中ajax函数执行顺序问题之如何设置同步
Feb 28 #Javascript
You might like
php遍历数组的方法分享
2012/03/22 PHP
php页面,mysql数据库转utf-8乱码,utf-8编码问题总结
2015/08/27 PHP
PHP 7.0.2 正式版发布
2016/01/08 PHP
laravel5.6实现数值转换
2019/10/23 PHP
php数组指针函数功能及用法示例
2020/02/11 PHP
使用Javascript和DOM Interfaces来处理HTML
2006/10/09 Javascript
xml文档转换工具,附图表例子(hta)
2010/11/17 Javascript
关于Javascript 对象(object)的prototype
2014/05/09 Javascript
Jquery中基本选择器用法实例详解
2015/05/18 Javascript
javascript实现动态统计图开发实例
2015/11/21 Javascript
js仿支付宝多方框输入支付密码效果
2016/09/27 Javascript
解决ionic和angular上拉加载的问题
2017/08/03 Javascript
利用ES6的Promise.all实现至少请求多长时间的实例
2017/08/28 Javascript
node.js支持多用户web终端实现及安全方案
2017/11/29 Javascript
react redux入门示例
2018/04/19 Javascript
如何在Node和浏览器控制台中打印彩色文字
2020/01/09 Javascript
微信小程序去除左上角返回键的实现方法
2020/03/06 Javascript
vue使用screenfull插件实现全屏功能
2020/09/17 Javascript
[05:04]完美世界携手游戏风云打造 卡尔工作室地图界面篇
2013/04/23 DOTA
[00:59]DOTA2英雄背景故事——上古巨神
2020/06/28 DOTA
[37:45]完美世界DOTA2联赛PWL S3 LBZS vs Phoenix 第二场 12.09
2020/12/11 DOTA
对于Python装饰器使用的一些建议
2015/06/03 Python
详解Python3的TFTP文件传输
2018/06/26 Python
Python 利用scrapy爬虫通过短短50行代码下载整站短视频
2018/10/29 Python
django开发post接口简单案例,获取参数值的方法
2018/12/11 Python
详解Python 字符串相似性的几种度量方法
2019/08/29 Python
Python爬虫模拟登陆哔哩哔哩(bilibili)并突破点选验证码功能
2020/12/21 Python
Chain Reaction Cycles芬兰:世界上最大的在线自行车商店
2017/12/06 全球购物
发现世界上最好的珠宝设计师:JewelStreet
2017/12/17 全球购物
家长对孩子评语
2014/01/30 职场文书
2014全国两会学习心得体会1000字
2014/03/10 职场文书
行政办公室岗位职责
2014/03/18 职场文书
C++程序员求职信
2014/05/07 职场文书
不遵守课堂纪律的检讨书
2014/09/24 职场文书
房租涨价通知
2015/04/23 职场文书
JavaScript中MutationObServer监听DOM元素详情
2021/11/27 Javascript