ajax提交form表单方法
ajax提交form表单方法
由 driventokill 创建,Alma 最后一次修改 2018-04-23 15:46:20
ajax提交form表单,这在日常项目中是经常用到的。前台无论是简单的html、jsp或者使用了easyui框架,只要是提交表单一般都会使用到ajax。
ajax提交表单分为两种:
1、无返回结果的,就是把表单数据直接提交给后台,让后台直接处理;
最简单的就是$(“#formid”).submit();直接将form表单提交到后台。
2、返回有结果的,这种情况下,后台不管是执行成功还是失败,最终的信息都需要返回到前台。
第二种是使用最多的一种,因为程序的执行成功与否都需要给用户提示,程序一般也都是多步完成的,执行完插入操作,需要发起流程,这就需要在界面上判断成功与否。ajax本身属于有返回结果的一类,其中的success方法就是处理后台返回结果的。
ajax提交表单有返回结果的有两种实现方式:
1、将form表单数据序列化
<span style="font-size:18px;"> $.ajax({ type: "POST", url:your-url, data:$('#yourformid').serialize(), async: false, error: function(request) { alert("Connection error"); }, success: function(data) { //接收后台返回的结果} });</span>
需要注意的是,使用这种方法的前提是form表单中的项一定要有name属性,后台获取的键值对为key=name值,value=各项值。
注意:无论是input标签还是span标签或者其他标签,一定要有name属性,没有name属性后台是获取不到该项的。
2、通过窗口查找form提交
<span style="font-size:18px;"> // 提交表单var obj = document.getElementById("xx_iframe").contentWindow; obj.$("#yourform").form("submit",{ success :function(data){ //对结果处理} });</span>
因为在当前界面上弹出对话框,然后在对话框上的按钮触发对话框中表单提交,对话框又是链接的另外的html页面,如此通过$(“#formid”)的方式是找不到对话框中的form的,因此这种情况下只能使用这种方式提交表单。
另外ajax中封装的get,post请求也都属于有返回结果的一类。
总的来说,无返回结果的和有返回结果的(将form表单数据序列化+通过窗口实现form提交),form表单都必须要有name属性。
ajax提交form表单方法相关推荐
- 使用ajax提交form表单,包括ajax文件上传 转http://www.cnblogs.com/zhuxiaojie/p/4783939.html...
使用ajax提交form表单,包括ajax文件上传 前言 使用ajax请求数据,很多人都会,比如说: $.post(path,{data:data},function(data){... },&quo ...
- 学习日志day45(2021-09-09)(1、有道翻译API使用json格式数据 2、JSONP 3、Ajax提交form表单 4、Web Uploader)
学习内容:学习JavaWeb(Day45) 1.有道翻译API使用json格式数据 2.JSONP 3.Ajax提交form表单 4.Web Uploader 1.有道翻译API使用json格式数据 ...
- SpringMVC 用对象接收 ajax提交form表单
SpringMVC 用对象接收 ajax提交form表单 转载于:http://www.cnblogs.com/klwyrn/p/5955152.html 第一种方法(简单易用,防蚊虫): 1.1 ...
- 提交form表单方法
ajax提交form表单,这在日常项目中是经常用到的.前台无论是简单的html.jsp或者使用了easyui框架,只要是提交表单一般都会使用到ajax. ajax提交表单分为两种: 1.无返回结果的, ...
- ajax 表单提交传文件,Ajax提交Form表单及文件上传
刚刚申请下来的博客,写得第一篇.有点小激动,本人以前是一名工业3D设计师突然有些变故做上了JavaWeb开发: 前几天,发现了一些小问题.我在写后台管理页面时,需要上传一张图片.于是我就用很普通的Fo ...
- 利用ajax提交form表单数据
利用thymeleaf引擎创建的html中,使用了adminLTE模板,ajax提交form表单数据,本以为很容易实现,却遇到了很多问题,这里进行总结. 1.get方式提交 通过serialize() ...
- ajax提交form表单
ajax和form表单有很多有趣的互动,ajax提交form表单就是其中一种,这种方法主要是用来提交带图数据的. html页面,我把图片单独放到form表单内,其他数据放到form外即可 <fo ...
- 用ajax提交表单给数据库,如何利用ajax提交form表单到数据库
如何利用ajax提交form表单到数据库 发布时间:2021-06-17 14:52:49 来源:亿速云 阅读:75 作者:小新 这篇文章主要介绍如何利用ajax提交form表单到数据库,文中介绍的非 ...
- # Ajax提交Form表单以及后端取值(java)
Ajax提交Form表单以及后端取值(java) 1.ajax提交form表单:提交的按钮οnclick="denglu()"时候触发ajax方法 <script>fu ...
最新文章
- node.js安装初体验
- Angular和SAP C4C的事件处理队列
- VS2005工程的Device右边内容为空问题
- std::get(std::tuple)
- wxpython是干嘛的_你都用 Python 来做什么?
- 话说关于 ZooKeeper 方面,面试有什么可问的啊?​
- python基础19 -------面向对象终结篇(介绍python对象中各种内置命令)
- 面向对象之软件需求中的体系构造
- 《Java完全参考手册》总结(1)
- ShaderForge安装教程
- win7局域网共享教程
- 解决python 服务端口探测探活
- 冯诺伊曼计算机釆用二进制,大一新生计算机考试重点复习资料(完整版).docx...
- Debian添加自启动的两种方式
- Windows编程笔记小结
- WEB端和手机端-三种提示框架
- 【NOWCODE SEVEN】:二分查找/排序
- EZ-USB CY7C68013A固件Slave FIFO初始化
- 持续盈利背后,水滴“新增长”难寻?
- excel 透视表 vba_使用Excel VBA删除数据透视表计算字段
热门文章
- HTML数字项目标签千位分隔符,请使用千位分隔符(逗号)表示web网页中的大数字
- 【c++常见错误01】error C2662: ‘const xxx‘: cannot convert ‘this‘ pointer from ‘xxx‘ to ‘xxx‘
- 【R的网络提取】什么值得买批量提取商品信息和价格等数据
- 《虚空之遗》zvt轰炸艇流三开攻略
- 外星人安装linux系统安装教程,Linux Mint(Ubuntu)Wine安装以及 Gecko安装
- 0基础学习VR全景平台篇第33章:场景功能-嵌入标尺
- linux里创建文件夹、创建文件夹子文件夹、删除文件夹和文件、访问指定目录级返回上一级目录
- 一篇就够用了——深度学习Ubuntu16.04环境配置+Win10双系统
- 数仓(二)—业务数据采集平台
- Thrift语法参考