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 相关文章推荐
MooTools 1.2中的Drag.Move来实现拖放
Sep 15 Javascript
jQuery EasyUI API 中文文档 可调整尺寸
Sep 29 Javascript
javascript 构造函数强制调用经验总结
Dec 02 Javascript
JS获取网页属性包括宽、高等等
Apr 03 Javascript
javascript实现全角与半角字符的转换
Jan 07 Javascript
jquery实现鼠标滑过显示二级下拉菜单效果
Aug 24 Javascript
jQuery基础_入门必看知识点
Jul 04 Javascript
全面了解构造函数继承关键apply call
Jul 26 Javascript
使用bootstrap-paginator.js 分页来进行ajax 异步分页请求示例
Mar 09 Javascript
微信小程序工具函数封装
Oct 28 Javascript
详解Webpack抽离第三方类库以及common解决方案
Mar 30 Javascript
react基本安装与测试示例
Apr 27 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
亚洲咖啡有什么?亚洲咖啡产地介绍 亚洲咖啡有什么特点?
2021/03/05 新手入门
PHP 图片水印类代码
2012/08/27 PHP
ucenter中词语过滤原理分析
2016/07/13 PHP
php常用的工具开发整理
2019/09/26 PHP
PHP实现Markdown文章上传到七牛图床的实例内容
2020/02/11 PHP
CSS+Jquery实现页面圆角框方法大全
2009/12/24 Javascript
javascript对数组的常用操作代码 数组方法总汇
2011/01/27 Javascript
Javascript实现页面跳转的几种方式分享
2013/10/26 Javascript
JavaScript中for-in遍历方式示例介绍
2014/02/11 Javascript
jquery 绑定回车动作扑捉回车键触发的事件
2014/03/26 Javascript
js调试工具Console命令详解
2014/10/21 Javascript
jQuery+css3动画属性制作猎豹浏览器宽屏banner焦点图
2015/03/16 Javascript
JavaScript中创建字典对象(dictionary)实例
2015/03/31 Javascript
JS处理json日期格式化问题
2015/10/01 Javascript
JS与jQuery遍历Table所有单元格内容的方法
2015/12/07 Javascript
Vue 2.x教程之基础API
2017/03/06 Javascript
Vue监听数组变化源码解析
2017/03/09 Javascript
Cropper.js 实现裁剪图片并上传(PC端)
2017/08/20 Javascript
详谈vue+webpack解决css引用图片打包后找不到资源文件的问题
2018/03/06 Javascript
使用vue-cli3 创建vue项目并配置VS Code 自动代码格式化 vue语法高亮问题
2019/05/14 Javascript
Vue实现点击箭头上下移动效果
2020/06/11 Javascript
vue组件开发之slider组件使用详解
2020/08/21 Javascript
[48:46]完美世界DOTA2联赛PWL S2 SZ vs FTD.C 第二场 11.19
2020/11/19 DOTA
python实现代理服务功能实例
2013/11/15 Python
Python简单连接MongoDB数据库的方法
2016/03/15 Python
python 查找字符串是否存在实例详解
2017/01/20 Python
pycharm new project变成灰色的解决方法
2019/06/27 Python
Python类的动态绑定实现原理
2020/03/21 Python
韩国女装NO.1网店:STYLENANDA
2016/09/16 全球购物
澳大利亚票务和娱乐市场领导者:Ticketmaster
2017/03/03 全球购物
播音主持女孩的自我评价分享
2013/11/20 职场文书
教育技术学专业职业规划书
2014/03/03 职场文书
汽车维修求职信
2014/06/15 职场文书
药剂专业毕业生求职信
2014/06/24 职场文书
推荐六本经典文学奖书籍:此生必读
2019/08/22 职场文书
深入理解python协程
2021/06/15 Python