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 相关文章推荐
基于jQuery的弹出消息插件 DivAlert之旅(一)
Apr 01 Javascript
node.js中的fs.existsSync方法使用说明
Dec 17 Javascript
JS实现文字向下滚动完整实例
Feb 06 Javascript
AngularJs directive详解及示例代码
Sep 01 Javascript
Vue.js常用指令的使用小结
Jun 23 Javascript
JS实现的倒计时恢复按钮点击功能【可用于协议阅读倒计时】
Apr 19 Javascript
微信小程序实现图片上传
May 23 Javascript
Layui实现数据表格默认全部显示(不要分页)
Oct 26 Javascript
node.js使用stream模块实现自定义流示例
Feb 13 Javascript
vue用elementui写form表单时,在label里添加空格操作
Aug 13 Javascript
js 函数性能比较方法
Aug 24 Javascript
ant design 日期格式化的实现
Oct 27 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显示MySQL数据的三种方法
2008/06/05 PHP
PHP开发中常用的字符串操作函数
2011/02/08 PHP
学习使用curl采集curl使用方法
2012/01/11 PHP
解析PHP留言本模块主要功能的函数说明(代码可实现)
2013/06/25 PHP
PHP中is_file不能替代file_exists的理由
2014/03/04 PHP
PHP产生不重复随机数的5个方法总结
2014/11/12 PHP
PHP程序员必须清楚的问题汇总
2014/12/18 PHP
JavaScript 判断浏览器类型及版本
2009/02/21 Javascript
图片Slider 带左右按钮的js示例
2013/08/30 Javascript
JQuery动画animate的stop方法使用详解
2014/05/09 Javascript
JavaScript模版引擎的基本实现方法浅析
2016/02/15 Javascript
jQuery Ajax 加载数据时异步显示加载动画
2016/08/01 Javascript
jQueryUI Datepicker组件设置日期高亮
2016/10/13 Javascript
AngularJS中update两次出现$promise属性无法识别的解决方法
2017/01/05 Javascript
bootstrap multiselect 多选功能实现方法
2017/06/05 Javascript
深入理解Vue 的条件渲染和列表渲染
2017/09/01 Javascript
Python使用SQLite和Excel操作进行数据分析
2018/01/20 Python
详解Python_shutil模块
2019/03/15 Python
Python时间和字符串转换操作实例分析
2019/03/16 Python
Python抓包程序mitmproxy安装和使用过程图解
2020/03/02 Python
利用css3 translate完美实现表头固定效果
2017/02/28 HTML / CSS
利用css3径向渐变做一张优惠券的示例
2018/03/22 HTML / CSS
CSS3贝塞尔曲线示例:创建链接悬停动画效果
2020/11/19 HTML / CSS
End Clothing美国站:英国男士潮牌商城
2018/04/20 全球购物
一些PHP的面试题
2015/05/06 面试题
在对linux系统分区进行格式化时需要对磁盘簇(或i节点密度)的大小进行选择,请说明选择的原则
2012/01/13 面试题
护士自荐信怎么写
2013/10/18 职场文书
怎样写留学自荐信
2013/11/11 职场文书
工程业务员工作职责
2013/12/07 职场文书
《放飞蜻蜓》教学反思
2014/04/27 职场文书
感情真挚的毕业生求职信
2014/07/19 职场文书
关于读书的演讲稿300字
2014/08/27 职场文书
滞留工资返还协议书
2014/10/19 职场文书
四年级数学教学反思
2016/02/16 职场文书
Python实现对齐打印 format函数的用法
2022/04/28 Python
使用 DataAnt 监控 Apache APISIX的原理解析
2022/07/07 Servers