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 相关文章推荐
window.showModalDialog()返回值的学习心得总结
Jan 07 Javascript
深入理解JavaScript系列(26):设计模式之构造函数模式详解
Mar 03 Javascript
javascript实现checkBox的全选,反选与赋值
Mar 12 Javascript
jQuery实现自动滚动到页面顶端的方法
May 22 Javascript
利用n工具轻松管理Node.js的版本
Apr 21 Javascript
JavaScript中数组常见操作技巧
Sep 01 Javascript
bootstrap时间插件daterangepicker使用详解
Oct 19 Javascript
iview table高度动态设置方法
Mar 14 Javascript
解决Vue.js父组件$on无法监听子组件$emit触发事件的问题
Sep 12 Javascript
layui 上传文件_批量导入数据UI的方法
Sep 23 Javascript
js实现时钟定时器
Mar 26 Javascript
Vue ElementUI实现:限制输入框只能输入正整数的问题
Jul 31 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文件上传后端处理小技巧
2016/05/22 PHP
PHP list() 将数组中的值赋给变量的简单实例
2016/06/13 PHP
php mysql_real_escape_string addslashes及mysql绑定参数防SQL注入攻击
2016/12/23 PHP
Yii CFileCache 获取不到值的原因分析
2017/02/08 PHP
Laravel框架基础语法与知识点整理【模板变量、输出、include引入子视图等】
2019/12/03 PHP
PHP实现微信提现功能(微信商城)
2019/11/21 PHP
PHP var关键字相关原理及使用实例解析
2020/07/11 PHP
JavaScript 捕获窗口关闭事件
2009/07/26 Javascript
JQuery1.6 使用方法三
2011/11/23 Javascript
2则自己编写的jQuery特效分享
2015/02/26 Javascript
超漂亮的Bootstrap 富文本编辑器summernote
2016/04/05 Javascript
JavaScript中的数组遍历forEach()与map()方法以及兼容写法介绍
2016/05/19 Javascript
对jQuary选择器的全面总结
2016/06/20 Javascript
JS基础随笔(菜鸟必看篇)
2016/07/13 Javascript
总结JavaScript的正则与其他语言的不同之处
2016/08/25 Javascript
Nuxt.js开启SSR渲染的教程详解
2018/11/30 Javascript
小程序扫描普通链接二维码跳转小程序指定界面方法
2019/05/07 Javascript
Vue + Elementui实现多标签页共存的方法
2019/06/12 Javascript
解决Antd Table表头加Icon和气泡提示的坑
2020/11/17 Javascript
Python判断字符串与大小写转换
2015/06/08 Python
python编程开发之类型转换convert实例分析
2015/11/13 Python
基于使用paramiko执行远程linux主机命令(详解)
2017/10/16 Python
python之消除前缀重命名的方法
2018/10/21 Python
启动Atom并运行python文件的步骤
2018/11/09 Python
5分钟 Pipenv 上手指南
2018/12/20 Python
postman传递当前时间戳实例详解
2019/09/14 Python
python3反转字符串的3种方法(小结)
2019/11/07 Python
Scrapy框架基本命令与settings.py设置
2020/02/06 Python
如何基于Python按行合并两个txt
2020/11/03 Python
HTML5的结构和语义(2):结构
2008/10/17 HTML / CSS
全球性的女装店:storets
2019/06/12 全球购物
普通话宣传标语
2014/06/26 职场文书
三年级学生评语大全
2014/12/26 职场文书
2016继续教育研修日志
2015/11/13 职场文书
2016年社区服务活动总结
2016/04/06 职场文书
Win11 Beta 22621.601 和 22622.601今日发布 KB5017384修复内容汇总
2022/09/23 数码科技