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 相关文章推荐
jquery中的sortable排序之后的保存状态的解决方法
Jan 28 Javascript
腾讯与新浪的通过IP地址获取当前地理位置(省份)的接口
Jul 26 Javascript
IE事件对象(The Internet Explorer Event Object)
Jun 27 Javascript
javascript的propertyIsEnumerable()方法使用介绍
Apr 09 Javascript
jquery加载图片时以淡入方式显示的方法
Jan 14 Javascript
JQuery 动态生成Table表格实例代码
Dec 02 Javascript
jQuery代码实现实时获取时间
Jan 29 Javascript
javascript实现多张图片左右无缝滚动效果
Mar 22 Javascript
详解vue嵌套路由-query传递参数
May 23 Javascript
vue计算属性时v-for处理数组时遇到的一个bug问题
Jan 21 Javascript
关于layui时间回显问题的解决方法
Sep 24 Javascript
vue-cli3项目升级到vue-cli4 的方法总结
Mar 19 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+js实现图片的上传、裁剪、预览、提交示例
2013/08/27 PHP
php生成静态页面的简单示例
2014/04/17 PHP
php中实现可以返回多个值的函数实例
2015/03/21 PHP
JavaScript面向对象之静态与非静态类
2010/02/03 Javascript
js获取select默认选中的Option并不是当前选中值
2014/05/07 Javascript
JavaScript将XML转成JSON的方法
2015/03/12 Javascript
Jquery幻灯片特效代码分享--打开页面随机选择切换方式(3)
2015/08/15 Javascript
js监听键盘事件的方法_原生和jquery的区别详解
2016/10/10 Javascript
bootstrap table复杂操作代码
2016/11/01 Javascript
Vue.js实现文章评论和回复评论功能
2020/05/30 Javascript
mongoose中利用populate处理嵌套的方法
2017/05/26 Javascript
使用JS编写的随机抽取号码的小程序
2017/08/11 Javascript
JS函数节流和函数防抖问题分析
2017/12/18 Javascript
javascript用rem来做响应式开发
2018/01/13 Javascript
Vue.js的模板语法详解
2020/02/16 Javascript
[02:08]2018年度CS GO枪械皮肤设计大赛优秀作者-完美盛典
2018/12/16 DOTA
python使用pil进行图像处理(等比例压缩、裁剪)实例代码
2017/12/11 Python
Python用61行代码实现图片像素化的示例代码
2018/12/10 Python
对python requests发送json格式数据的实例详解
2018/12/19 Python
python生成器/yield协程/gevent写简单的图片下载器功能示例
2019/10/28 Python
python 导入数据及作图的实现
2019/12/03 Python
python enumerate内置函数用法总结
2020/01/07 Python
关于tf.reverse_sequence()简述
2020/01/20 Python
使用Keras实现简单线性回归模型操作
2020/06/12 Python
Famous Footwear加拿大:美国多品牌运动休闲鞋店
2018/12/05 全球购物
UNIX特点都有哪些
2016/04/05 面试题
业务员岗位职责
2013/11/16 职场文书
教学器材管理制度
2014/01/26 职场文书
环境保护建议书
2014/08/26 职场文书
2014党员学习习主席讲话思想汇报
2014/09/15 职场文书
卖房授权委托书样本
2014/10/05 职场文书
本溪水洞导游词
2015/02/11 职场文书
2015年纪念“卢沟桥事变”78周年活动方案
2015/05/06 职场文书
中学生打架检讨书之500字
2019/08/06 职场文书
zabbix agent2 监控oracle数据库的方法
2021/05/13 Oracle
SQLyog的下载、安装、破解、配置教程(MySQL可视化工具安装)
2022/09/23 MySQL