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 相关文章推荐
javascript 读取xml,写入xml 实现代码
Jul 10 Javascript
前端开发必须知道的JS之原型和继承
Jul 06 Javascript
一行代码告别document.getElementById
Jun 01 Javascript
javascript生成随机颜色示例代码
May 05 Javascript
总结Javascript中的隐式类型转换
Aug 24 Javascript
Angular4.0中引入laydate.js日期插件的方法教程
Dec 25 Javascript
JS运动特效之任意值添加运动的方法分析
Jan 24 Javascript
vue项目中引入vue-datepicker插件的详解
May 14 Javascript
vue如何实现自定义底部菜单栏
Jul 01 Javascript
这应该是最详细的响应式系统讲解了
Jul 22 Javascript
JavaScript在web自动化测试中的作用示例详解
Aug 25 Javascript
使用Vue 自定义文件选择器组件的实例代码
Mar 04 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将字符串全部转换成大写或者小写的方法
2015/03/17 PHP
在Laravel5.6中使用Swoole的协程数据库查询
2018/06/15 PHP
PHP调用全国天气预报数据接口查询天气示例
2019/02/20 PHP
微信公众平台开发教程⑥ 微信开发集成类的使用图文详解
2019/04/10 PHP
JS解密入门之凭直觉解
2008/06/25 Javascript
JQuery动态创建DOM、表单元素的实现代码
2011/08/09 Javascript
jquery+css+ul模拟列表菜单具体实现思路
2013/04/15 Javascript
Jquery实现鼠标移上弹出提示框、移出消失思路及代码
2013/05/19 Javascript
利用jquery写的左右轮播图特效
2014/02/12 Javascript
jQuery实现ichat在线客服插件
2014/12/29 Javascript
轻松学习jQuery插件EasyUI EasyUI创建菜单与按钮
2015/11/30 Javascript
JS函数的几种定义方式分析
2015/12/17 Javascript
js获取客户端操作系统类型的方法【测试可用】
2016/05/27 Javascript
浅谈js原生拖放
2016/11/21 Javascript
Angular ui.bootstrap.pagination分页
2017/01/20 Javascript
浅谈JS验证表单文本域输入空格的问题
2017/02/14 Javascript
requirejs按需加载angularjs文件实例
2017/06/08 Javascript
使用jQuery实现页面定时弹出广告效果
2017/08/24 jQuery
Django与Vue语法的冲突问题完美解决方法
2017/12/14 Javascript
jQuery中ajax获取数据赋值给页面的实例
2017/12/31 jQuery
JQuery属性操作与循环用法示例
2019/05/15 jQuery
微信小程序登陆注册功能的实现代码
2019/12/10 Javascript
jQuery使用hide()、toggle()函数实现相机品牌展示隐藏功能
2021/01/29 jQuery
Python使用matplotlib实现在坐标系中画一个矩形的方法
2015/05/20 Python
深入解析Python中的上下文管理器
2016/06/28 Python
Python常见格式化字符串方法小结【百分号与format方法】
2016/09/18 Python
用python制作游戏外挂
2018/01/04 Python
python实现俄罗斯方块游戏
2020/03/25 Python
Melijoe英国官网:法国儿童时尚网站
2016/11/18 全球购物
暑期实习鉴定
2013/12/16 职场文书
应届毕业生自荐信例文
2014/02/26 职场文书
护士求职信
2014/07/05 职场文书
2014年安全管理工作总结
2014/12/01 职场文书
地道战观后感
2015/06/04 职场文书
护士岗前培训心得体会
2016/01/08 职场文书
python中出现invalid syntax报错的几种原因分析
2022/02/12 Python