jquery的ajax提交form表单的两种方法小结(推荐)


Posted in Javascript onMay 25, 2016

jquery的ajax提交form表单的两种方法小结(推荐)

方法一:

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>

以上这篇jquery的ajax提交form表单的两种方法小结(推荐)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
非html5实现js版弹球游戏示例代码
Sep 22 Javascript
js控制再次点击按钮之间的间隔时间可防止重复提交
Aug 01 Javascript
javascript搜索框点击文字消失失焦时文本出现
Sep 18 Javascript
node.js开机自启动脚本文件
Dec 24 Javascript
jQuery插件Zclip实现完美兼容个浏览器点击复制内容到剪贴板
Apr 30 Javascript
js仿QQ中对联系人向左滑动、滑出删除按钮的操作
Apr 07 Javascript
JS继承之借用构造函数继承和组合继承
Sep 07 Javascript
JavaScript基于扩展String实现替换字符串中index处字符的方法
Jun 13 Javascript
vue监听对象及对象属性问题
Aug 20 Javascript
React手稿之 React-Saga的详解
Nov 12 Javascript
node中使用log4js4.x版本记录日志的方法
Aug 20 Javascript
基于js判断浏览器是否支持webGL
Apr 18 Javascript
BootStrap的Datepicker控件使用心得分享
May 25 #Javascript
jquery按回车键实现表单提交的简单实例
May 25 #Javascript
Javascript之BOM(window对象)详解
May 25 #Javascript
jQueryUI中的datepicker使用方法详解
May 25 #Javascript
jQuery+PHP实现微信转盘抽奖功能的方法
May 25 #Javascript
jQuery获取访问者IP地址的方法(基于新浪API与QQ查询接口)
May 25 #Javascript
JQuery的常用选择器、过滤器、方法全面介绍
May 25 #Javascript
You might like
聊天室php&amp;mysql(二)
2006/10/09 PHP
php设计模式 Builder(建造者模式)
2011/06/26 PHP
Smarty中的注释和截断功能介绍
2015/04/09 PHP
JSON 数字排序多字段排序介绍
2013/09/18 Javascript
浅析Js中的单引号与双引号问题
2013/11/06 Javascript
jquery在项目中做复选框时遇到的一些问题笔记
2013/11/17 Javascript
跟我学习javascript解决异步编程异常方案
2015/11/23 Javascript
JS两种类型的表单提交方法实例分析
2016/11/28 Javascript
vuex的使用及持久化state的方式详解
2018/01/23 Javascript
vue.js使用v-model指令实现的数据双向绑定功能示例
2018/05/22 Javascript
微信小程序点击图片实现长按预览、保存、识别带参数二维码、转发等功能
2019/07/20 Javascript
LayUI switch 开关监听 获取属性值、更改状态的方法
2019/09/21 Javascript
Javascript实现秒表计时游戏
2020/05/27 Javascript
Python中比较特别的除法运算和幂运算介绍
2015/04/05 Python
研究Python的ORM框架中的SQLAlchemy库的映射关系
2015/04/25 Python
python制作爬虫并将抓取结果保存到excel中
2016/04/06 Python
Python判断列表是否已排序的各种方法及其性能分析
2016/06/20 Python
详解Python中使用base64模块来处理base64编码的方法
2016/07/01 Python
Python使用Matplotlib实现Logos设计代码
2017/12/25 Python
Python打开文件,将list、numpy数组内容写入txt文件中的方法
2018/10/26 Python
使用Python创建简单的HTTP服务器的方法步骤
2019/04/26 Python
Django对models里的objects的使用详解
2019/08/17 Python
Python制作词云图代码实例
2019/09/09 Python
Python @property原理解析和用法实例
2020/02/11 Python
解决Django Haystack全文检索为空的问题
2020/05/19 Python
python urllib和urllib3知识点总结
2021/02/08 Python
移动端Html5页面生成图片解决方案
2018/08/07 HTML / CSS
Microsoft新加坡官方网站:购买微软最新软件和技术产品
2016/10/28 全球购物
什么是测试驱动开发(TDD)
2012/02/15 面试题
出口公司经理求职简历中的自我评价
2013/10/13 职场文书
园林毕业生自我鉴定范文
2013/12/29 职场文书
农业资源与环境专业自荐信范文
2013/12/30 职场文书
庆中秋节主题活动方案
2014/02/03 职场文书
餐饮总经理岗位职责
2014/03/07 职场文书
业务内勤岗位职责
2015/04/13 职场文书
用JS写一个发布订阅模式
2021/11/07 Javascript