form表单只提交数据而不进行页面跳转的解决方案
一般的form提交操作写法为
……
<input type="submit" value="保存报告"/>
</form>
点击submit按钮或直接回车可以将数据提交到saveReport页面,但是提交后也会跳转到saveReport页面
如何做到
将数据提交到saveReport(form的action指向)页面,但是页面又不进行跳转,即保持当前页面不变呢??
这种需要在load一个页面的时候尤其迫切。
利用jquery的ajaxSubmit函数以及form的onsubmit函数完成,如下:
<form id="saveReportForm" action="saveReport.htm" method="post" onsubmit="return saveReport();">
<input type="submit" value="保存报告"/>
</form>
form增加一个id用于在jquery中调用,增加一个onsubmit函数用于submit前自己提交表单
saveReport对应函数为
// jquery 表单提交
$("#showDataForm").ajaxSubmit(function(message) {
// 对于表单提交成功后处理,message为提交页面saveReport.htm的返回内容
});
return false; // 必须返回false,否则表单会自己再做一次提交操作,并且页面跳转
}
form表单只提交数据而不进行页面跳转的解决方案的更多相关文章
- Jquery构建Form表单Post提交数据的简单方法
$.extend({ PostSubmitForm: function (url, args) { var body = $(document.body), form = $("<fo ...
- form表单action提交表单,页面不跳转且表单数据含文件的处理方法
在最近的项目中需要将含 input[type='file']的表单提交给后台 ,并且后台需要将文件存储在数据库中.之前所用的方法都是先将文件上传到七牛服务器上,然后七牛会返回文件的下载地址,在提交表单 ...
- 使用ajax方法实现form表单的提交(附源码)
写在前面的话 在使用form表单的时候,一旦点击提交触发submit事件,一般会使得页面跳转,页面间的跳转等行为的控制权往往在后端,后端会控制页面的跳转及数据传递,但是在某些时候不希望页面跳转,或者说 ...
- 使用ajax方法实现form表单的提交
作者:13 GitHub:https://github.com/ZHENFENG13 版权声明:本文为原创文章,未经允许不得转载. 写在前面的话 在使用form表单的时候,一旦点击提交触发submit ...
- JavaWeb学习总结(十一):Session解决form表单重复提交
在平时开发中,如果网速比较慢的情况下,用户提交表单后,发现服务器半天都没有响应,那么用户可能会以为是自己没有提交表单,就会再点击提交按钮重复提交表单,我们在开发中必须防止表单重复提交. 一.表单重复提 ...
- 微信自带浏览器不支持form表单post提交方案解决
微信自带浏览器form表单post提交,Java控制后台获取不到值得解决方案: 第一种:把post改成get请求,但是改后另一个问题来了就是,数据不安全了,连接上都能看到,导致数据会流失,Java ...
- 利用 ajax自定义Form表单的提交方式
需求场景:有时候单纯的form表单无法向后端传递额外的参数 比如需要action传递js异步生成的参数 ,form表单默认的action就无法满足需求,这时就需要我们自定义form表单的提交方式. h ...
- form表单ajax提交
这里下面有两种 第一种是form表单里面添加了数据,并且含有上传的图片,第二种是from表单中不含有图片 只有普通数据 第一种form表单中包含有图片的类型: <form method=&q ...
- JavaScript 创建一个 form 表单并提交
<!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8& ...
随机推荐
- f2fs源码分析之文件读写过程
本篇包括三个部分:1)f2fs 文件表示方法: 2)NAT详细介绍:3)f2fs文件读写过程:4) 下面详细阐述f2fs读写的过程. 管理数据位置关键的数据结构是node,node包括三种:inode ...
- usb驱动开发10之usb_device_match
在第五节我们说过会专门分析函数usb_device_match,以体现模型的重要性.同时,我们还是要守信用的. 再贴一遍代码,看代码就要不厌其烦. static int usb_device_matc ...
- Win2008R2配置WebDeploy
一.配置服务器 1.安装管理服务 2.点击管理服务进行配置 3.安装WebDeploy 3.1通过离线安装包方式安装: https://www.iis.net/downloads/microsoft/ ...
- C语言 结构体中属性的偏移量计算
//计算结构体偏移量 #include<stdio.h> #include<stdlib.h> #include<string.h> //详解:对于offscfof ...
- RTX与SVN使用手册适用于新手
一.RTX使用说明 1.下载 http://rtx.tencent.com/rtx/download/index.shtml rtx下载地址(可以只下载客户端) 2.使用方法 1)点击最下面的服务器设 ...
- 架构MVC——JS中的理论
什么是MVC MVC是一种设计模式,它将应用划分为3个部分:数据(模型).展现层(视图)和用户交互层(控制器). 一个事件发生的过程可以描述如下: 用户和应用产生交互 控制器的事件处理器被触发 控制器 ...
- 开发机上绕过Chrome同源策略的办法
开发机上绕过Chrome同源策略的办法 标签: Chrome同源策略跨域 2013-08-21 18:33 6071人阅读 评论(0) 收藏 举报 分类: Chrome扩展(1) 版权声明:本文为 ...
- OpenShift
一步一脚印 停停走走,回头看看 博客园 首页 新随笔 联系 订阅 管理 随笔 - 24 文章 - 8 评论 - 2 调戏OpenShift:一个免费能干的云平台 一.前因后果 以前为了搞微信的 ...
- eclipse的一些初始化设置
eclipse下载地址:http://www.eclipse.org/ 添加java注释模板 codetemplates.xml:Window->Preferences->Java-> ...
- 窥探算法之美妙——寻找数组中最小的K个数&python中巧用最大堆
原文发表在我的博客主页,转载请注明出处 前言 不论是小算法或者大系统,堆一直是某种场景下程序员比较亲睐的数据结构,而在python中,由于数据结构的极其灵活性,list,tuple, dict在很多情 ...