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 相关文章推荐
发布BlueShow v1.0 图片浏览器(类似lightbox)blueshow.js 打包下载
Jul 21 Javascript
7个Javascript地图脚本整理
Oct 20 Javascript
js特殊字符转义介绍
Nov 05 Javascript
通过action传过来的值在option获取进行验证的方法
Nov 14 Javascript
通过jquery 获取URL参数并进行转码
Aug 18 Javascript
javaScript中push函数用法实例分析
Jun 08 Javascript
jQuery幻灯片特效代码分享--鼠标滑过按钮时切换(2)
Nov 18 Javascript
JS/jQ实现免费获取手机验证码倒计时效果
Jun 13 Javascript
jQuery实现倒计时(倒计时年月日可自己输入)
Dec 02 Javascript
自定义事件解决重复请求BUG的问题
Jul 11 Javascript
VUE:vuex 用户登录信息的数据写入与获取方式
Nov 11 Javascript
react使用CSS实现react动画功能示例
May 18 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开启gzip页面压缩实例代码
2010/03/11 PHP
PHP网页游戏学习之Xnova(ogame)源码解读(十二)
2014/06/25 PHP
php.ini save_handler 修改不生效的解决办法
2014/07/22 PHP
ThinkPHP中URL路径访问与模块控制器之间的关系
2014/08/23 PHP
php使用递归计算文件夹大小
2014/12/24 PHP
php自定义函数实现二维数组排序功能
2016/07/20 PHP
PHP PDOStatement::nextRowset讲解
2019/02/01 PHP
PHP Swoole异步Redis客户端实现方法示例
2019/10/24 PHP
php pdo连接数据库操作示例
2019/11/18 PHP
在phpstudy集成环境下的nginx服务器下配置url重写
2019/12/02 PHP
JavaScript 实现鼠标拖动元素实例代码
2014/02/24 Javascript
基于JavaScript短信验证码如何实现
2016/01/24 Javascript
Bootstrap基本样式学习笔记之标签(5)
2016/12/07 Javascript
JS一个简单的注册页面实例
2017/09/05 Javascript
在vue项目中使用element-ui的Upload上传组件的示例
2018/02/08 Javascript
详解React 的几种条件渲染以及选择
2018/10/23 Javascript
vue框架中props的typescript用法详解
2020/02/17 Javascript
[01:14:30]TNC vs VG 2019国际邀请赛淘汰赛 胜者组赛BO3 第二场 8.20.mp4
2019/08/22 DOTA
Python模仿POST提交HTTP数据及使用Cookie值的方法
2014/11/10 Python
Python实现基于权重的随机数2种方法
2015/04/28 Python
Python3.2中Print函数用法实例详解
2015/05/19 Python
python3中bytes和string之间的互相转换
2017/02/09 Python
Python实现自动上京东抢手机
2018/02/06 Python
对Django 转发和重定向的实例详解
2019/08/06 Python
Python实现链表反转的方法分析【迭代法与递归法】
2020/02/22 Python
基于Keras 循环训练模型跑数据时内存泄漏的解决方式
2020/06/11 Python
Python修改DBF文件指定列
2020/12/19 Python
中学劳技课教师的自我评价
2014/02/05 职场文书
《圆明园的毁灭》教学反思
2014/02/28 职场文书
《雕塑之美》教学反思
2014/04/24 职场文书
公司证明怎么写
2014/09/22 职场文书
vue3中的组件间通信
2021/03/31 Vue.js
解析Java中的static关键字
2021/06/14 Java/Android
MySQL系列之十五 MySQL常用配置和性能压力测试
2021/07/02 MySQL
世界十大儿童漫画书排名,法国国宝漫画排第五,第二是轰动日本连环
2022/03/18 欧美动漫
vue3不同环境下实现配置代理
2022/05/25 Vue.js