使用jQuery.form库中ajaxSubmit提交表单时遇到的一些问题
初入前端,网上找的很多资料都不够详细,导致遇到很多问题,现记录如下:
1.首先引入
<script src="~/Scripts/jquery-1.10.2.js"></script>
<script src="~/Scripts/jquery.form.js"></script>
这个两个 脚本库,src属性为路径,注意顺序,form为jQuery的一个子库,因此放在后面。
2.js冲突。
我是在mvc下开发,引入库后运行提示ajaxSubmit函数找不到,ie会直接报异常,百度浏览器不会报异常,需要进入浏览器调试模式下发现。
百度了很久,多数都是说没有引入form库,也有少数的人说是由于js库冲突所致,子页面中引入的js库与母版页或布局页引入的js库冲突,没有找到明确的解决办法,
遂到布局页查看引入了哪些js库,查看到布局页中使用
@Scripts.Render("~/bundles/modernizr")
读取js文件,又查找相关资料发现,如果要在子页面引入其它js文件,应该使用下面方式,
@section scripts
{
<script src="~/Scripts/jquery.form.js"></script>
}
放在@section scripts块中。
3.刷新问题,这个问题是由于提交按钮type设置为submit导致,本身submit会自动执行当前视图的默认控制器方法,而又在按钮的单击事件中执行提交,从而进行刷新。
切记,使用ajaxSubmit等其它方式提交时,input标签type一定设置为button,不然多此一举。
4.ajaxSubmit没有提交,没有跳转到相应的控制器方法。
最开始使用的js代码:
function AddPicture_Click() {
var options = {
url: "/GraphicPublicize/Add", // 要调用的控制器方法
type: "post",
data: {
"typeName": $("#type_list").find("[class='type_list_selected']").text(),
}, // 传递的数据
beforeSubmit: ValidationBeforeSubmit, // 提交之前的回调函数
success: ResponseAfterSuccess, // 提交之后返回的回调函数
};
jQuery('#Form').submit(function () {
$("#Form").ajaxSubmit(options);
return false;
});
return;
}
此函数绑定到按钮的单击事件上。此方式无效,跟踪js明明执行了,但是回调函数和后端代码都没有执行。
之后改为:
function AddPicture_Click() {
var options = {
url: "/GraphicPublicize/Add", // 要调用的控制器方法
type: "post",
data: {
"typeName": $("#type_list").find("[class='type_list_selected']").text(),
}, // 传递的数据
beforeSubmit: ValidationBeforeSubmit, // 提交之前的回调函数
success: ResponseAfterSuccess, // 提交之后返回的回调函数
};
// jQuery('#Form').submit(function () { // 屏蔽这几行代码
$("#Form").ajaxSubmit(options);
// return false;
//});
return;
}
遂执行提交成功,什么原因我也不晓得。
5.传递数据问题,网上说照这样是可以传的,
var options = {
url: "/GraphicPublicize/Add", // 要调用的控制器方法
type: "post",
data: {
"typeName": $("#type_list").find("[class='type_list_selected']").text(),
}, // 传递的数据
beforeSubmit: ValidationBeforeSubmit, // 提交之前的回调函数
success: ResponseAfterSuccess, // 提交之后返回的回调函数
};
实测不行,还有说jquery.form.js文件源码不全,建议重新下载,还是不行,不知原因,又发现request中的param集合中有我需要的数据就没管了。
关于ajaxSubmit可另行参考http://www.cnblogs.com/Leo_wl/p/4393190.html#undefined。
质量不咋的,请指教。
使用jQuery.form库中ajaxSubmit提交表单时遇到的一些问题的更多相关文章
- jquery.form插件中动态修改表单数据
jquery.form jquery.form插件(http://malsup.com/jquery/form/)是大家经常会用到的一个jQuery插件,它可以很方便将表单转换为ajax的方式进行提交 ...
- jquery通过submit()和serialize()提交表单
<script type="text/javascript"> $(function() { $('#form1').submit(function() { //当提交 ...
- JavaWeb网上图书商城完整项目--day02-4.regist页面提交表单时对所有输入框进行校验
1.现在我们要将table表中的输入的参数全部提交到后台进行校验,我们提交我们是按照表单的形式提交,所以我们首先需要在table表外面添加一个表单 <%@ page language=" ...
- Ajax实现提交表单时验证码自动验证(原创自Zjmainstay)
本文通过源码展示如何实现表单提交前,验证码先检测正确性,不正确则不提交表单,更新验证码. 1.前端代码 index.html <!DOCTYPE html> <html> &l ...
- 只有设置了 name 属性的表单元素才能在提交表单时传递它们的值
$(function () { var wait = $("<img src=\"\" alt=\"正在上传\"/>"); $( ...
- Ajax提交表单时验证码自动验证 php后端验证码检测
本文通过源码展示如何实现表单提交前,验证码先检测正确性,不正确则不提交表单,更新验证码. 1.前端代码 index.html <!DOCTYPE html> <html> &l ...
- Django:提交表单时遇到403错误:CSRF verification failed
Django:提交表单时遇到403错误:CSRF verification failed 问题: 提交表单时遇到403错误:CSRF verification failed 解决方案: 在表单界面ht ...
- php提交表单时如何保留多个空格及换行的文本样式
需求是:用户提交表单时屏蔽敏感词的功能.其中敏感词来自服务器端同一路径下的ciku.txt,敏感词通过"|"连接,例如"g|c|a",提交表单时替换敏感词,更重 ...
- php提交表单时判断 if($_POST[submit])与 if(isset($_POST[submit])) 的区别
if(isset($_POST['submit'])) 它的意思是不是判断是否配置了$_POST['submit'] 这个变量呢?如果有这个变量 在执行其它代码 应该这样用if(isset($_POS ...
随机推荐
- 示波器X1探头和X10探头
示波器探头有X1和X10档,当测量一个信号时应该如何选择? 1.先我们看它们的区别? X1档,表示信号没有经过衰减进入示波器 X10档,表示信号衰减10倍进入示波器(当示波器也设置为X10档,直接读数 ...
- 前端笔记知识点整合之JavaScript(一)初识JavaScript
一.JavaScript简介 1.1网页分层 web前端一共分三层: 结构层 HTML : 负责搭建页面结构 样式层 CSS : 负责页面的美观 行为层 JavaSc ...
- 生成透视列之for xml path
临时表#t原始数据: 实现如下格式,即根据Province分组,把每个组对应的City列以某种格式展示: 实现方法: select t.Province,(select city+',' From # ...
- Ext z自写checkbox
软件弹出框Exr.window里面有许多个CheckBox,用ext自带的CheckBoxGroup也可以实现,但是在后期处理的时候远没有自写的CheckBox灵活,还出了一些莫名其妙的bug 忍无可 ...
- identifier of an instance of **** was altered from **** to *****
在用hibernate getSession().save(entity)方法保存数据库表实体类的时候报这个异常 我的需求是一个请求要往数据库表插两条数据,根据传值判断做了for循环调两次save() ...
- RCNN论文学习
[Rich feature hierarchies for accurate object detection and semantic segmentation] Abstract 论文的方 ...
- Django组件-Forms组件
Django的Forms组件主要有以下几大功能: 页面初始化,生成HTML标签 校验用户数据(显示错误信息) HTML Form提交保留上次提交数据 一.小试牛刀 1.定义Form类 from dja ...
- ubuntu apt不使用代理
常见的问题是apt使用代理. 不过今天遇到的情况是,桌面进不去,只能tty:在tty界面下,发现1080端口上开着代理,/etc/environment和~/.bashrc中都确保注释掉了http_p ...
- .net基础学java系列(八)SpringBoot
嘟嘟独立博客 Spring-Boot干货系列 http://tengj.top/categories/Spring-Boot干货系列/ 龙码精神 Java Spring Boot VS .NetCor ...
- 【转载】如何直观的理解 O(logn) 时间复杂度的神奇之处
转自 https://blog.csdn.net/u012814856/article/details/83010082 一.引言最近在极客时间上订阅了<数据结构与算法>的课程,其中王争老 ...