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的自定义鼠标提示效果 jquery.toolTip
Nov 14 Javascript
jQuery中bind()方法用法实例
Jan 19 Javascript
JQuery实现防止退格键返回的方法
Feb 12 Javascript
JavaScript实现倒计时代码段Item1(非常实用)
Nov 03 Javascript
JavaScript的字符串方法汇总
Jul 31 Javascript
微信小程序-获得用户输入内容
Feb 13 Javascript
JS实现数组去重复值的方法示例
Feb 18 Javascript
BootStrap表单控件之复选框checkbox和单选择按钮radio
May 23 Javascript
jQuery dateRangePicker插件使用方法详解
Jul 28 jQuery
Electron autoUpdater实现Windows安装包自动更新的方法
Dec 24 Javascript
微信小程序实现简单表格
Feb 14 Javascript
vue中实现图片压缩 file文件的方法
May 28 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-accelerator网站加速PHP缓冲的方法
2008/07/30 PHP
codeigniter中测试通过的分页类示例
2014/04/17 PHP
实现在同一方法中获取当前方法中新赋值的session值解决方法
2014/06/26 PHP
Yii基于CActiveForm的Ajax数据验证用法示例
2016/07/14 PHP
基于jquery实现的可以编辑选择的下拉框的代码
2010/11/19 Javascript
jQuery+AJAX实现遮罩层登录验证界面(附源码)
2020/09/13 Javascript
jquery实现简单的banner轮播效果【实例】
2016/03/30 Javascript
JS实现获取当前URL和来源URL的方法
2016/08/24 Javascript
Vue常用指令V-model用法
2017/03/08 Javascript
jQuery表格(Table)基本操作实例分析
2017/03/10 Javascript
AngularJS监听ng-repeat渲染完成的两种方法
2018/01/16 Javascript
Node.js 使用request模块下载文件的实例
2018/09/05 Javascript
highCharts提示框中显示当前时间的方法
2019/01/18 Javascript
函数式编程入门实践(一)
2019/04/20 Javascript
vue-element-admin 菜单标签失效的解决方式
2019/11/12 Javascript
JS字符串补全方法padStart()和padEnd()
2020/05/27 Javascript
vue+vuex+axios从后台获取数据存入vuex,组件之间共享数据操作
2020/07/31 Javascript
python测试驱动开发实例
2014/10/08 Python
python迭代器与生成器详解
2016/03/10 Python
Python调用C语言的方法【基于ctypes模块】
2018/01/22 Python
解析Python3中的Import
2019/10/13 Python
python在地图上画比例的实例详解
2020/11/13 Python
html5 迷宫游戏(碰撞检测)实例一
2013/07/25 HTML / CSS
英国电气世界:Electrical World
2019/09/08 全球购物
Android面试题附答案
2014/12/08 面试题
铭立家具面试题
2012/12/06 面试题
万户网络JAVA程序员岗位招聘笔试试卷
2013/01/08 面试题
求职信模版
2013/11/30 职场文书
《一株紫丁香》教学反思
2014/02/19 职场文书
促销活动总结范文
2014/04/30 职场文书
婚前保证书范文
2015/02/28 职场文书
和领导吃饭祝酒词
2015/08/11 职场文书
《去年的树》教学反思
2016/02/18 职场文书
2016小学优秀教师先进事迹材料
2016/02/26 职场文书
python实现Thrift服务端的方法
2021/04/20 Python
Mysql分库分表之后主键处理的几种方法
2022/02/15 MySQL