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 相关文章推荐
Javascript var变量隐式声明方法
Oct 19 Javascript
jQueryPad 实用的jQuery测试工具(支持IE,chrome,FF)
May 22 Javascript
JS基础之undefined与null的区别分析
Aug 08 Javascript
jQuery 删除/替换DOM元素的几种方式
May 20 Javascript
jQuery操作select下拉框的text值和value值的方法
May 31 Javascript
vue的Virtual Dom实现snabbdom解密
May 03 Javascript
详解Angular的8个主要构造块
Jun 20 Javascript
EasyUI实现下拉框多选功能
Nov 07 Javascript
angular基于ng-alain定义自己的select组件示例
Feb 23 Javascript
vue超时计算的组件实例代码
Jul 09 Javascript
微信小程序云开发使用方法新手初体验
May 16 Javascript
vue+element实现动态加载表单
Dec 13 Vue.js
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编程最快明白》第三讲:php数组
2010/11/01 PHP
php生成随机密码的几种方法
2011/01/17 PHP
php的array数组和使用实例简明教程(容易理解)
2014/03/20 PHP
PHP动态编译出现Cannot find autoconf的解决方法
2014/11/05 PHP
php数组键值用法实例分析
2015/02/27 PHP
php给每个段落添加空格的方法
2015/03/20 PHP
PHP中创建和验证哈希的简单方法实探
2015/07/06 PHP
PHP字符串和十六进制如何实现互相转换
2020/07/16 PHP
javascript addBookmark 加入收藏 多浏览器兼容
2009/08/15 Javascript
Javascript生成json的函数代码(可以用php的json_decode解码)
2012/06/11 Javascript
jquery中.add()的使用分析
2013/04/26 Javascript
JS简单的图片放大缩小的两种方法
2013/11/11 Javascript
Javascript基础教程之switch语句
2015/01/18 Javascript
jquery中filter方法用法实例分析
2015/02/06 Javascript
js实现鼠标经过时图片滚动停止的方法
2015/02/16 Javascript
Ionic如何创建APP项目
2016/06/03 Javascript
Bootstrap简单表单显示学习笔记
2016/11/15 Javascript
JS/jquery实现一个网页内同时调用多个倒计时的方法
2017/04/27 jQuery
深入webpack打包原理及loader和plugin的实现
2020/05/06 Javascript
python 换位密码算法的实例详解
2017/07/19 Python
Anaconda下安装mysql-python的包实例
2018/06/11 Python
python 将对象设置为可迭代的两种实现方法
2019/01/21 Python
Django Admin中增加导出Excel功能过程解析
2019/09/04 Python
YUV转为jpg图像的实现
2019/12/09 Python
Python捕获异常堆栈信息的几种方法(小结)
2020/05/18 Python
Pycharm导入anaconda环境的教程图解
2020/07/31 Python
Jmeter调用Python脚本实现参数互相传递的实现
2021/01/22 Python
了解AppleShare protocol(AppleShare协议)吗
2015/08/28 面试题
Java Servlet API中forward() 与redirect()的区别
2014/04/20 面试题
售后服务质量承诺书
2015/04/29 职场文书
正规欠条模板
2015/07/03 职场文书
大学军训心得体会800字
2016/01/11 职场文书
mysql 生成连续日期及变量赋值
2022/03/20 MySQL
浅谈Vue的computed计算属性
2022/03/21 Vue.js
java如何实现获取客户端ip地址的示例代码
2022/04/07 Java/Android
java实现自定义时钟并实现走时功能
2022/06/21 Java/Android