MyException - 我的异常网
当前位置:我的异常网» jQuery » 使用jQuery.form库中ajaxSubmit提交表单时遇到的一

使用jQuery.form库中ajaxSubmit提交表单时遇到的一些有关问题

www.MyException.Cn  网友分享于:2013-08-20  浏览:0次
使用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。

质量不咋的,请指教。

文章评论

程序员都该阅读的书
程序员都该阅读的书
要嫁就嫁程序猿—钱多话少死的早
要嫁就嫁程序猿—钱多话少死的早
中美印日四国程序员比较
中美印日四国程序员比较
总结2014中国互联网十大段子
总结2014中国互联网十大段子
看13位CEO、创始人和高管如何提高工作效率
看13位CEO、创始人和高管如何提高工作效率
 程序员的样子
程序员的样子
编程语言是女人
编程语言是女人
十大编程算法助程序员走上高手之路
十大编程算法助程序员走上高手之路
团队中“技术大拿”并非越多越好
团队中“技术大拿”并非越多越好
为啥Android手机总会越用越慢?
为啥Android手机总会越用越慢?
程序员最害怕的5件事 你中招了吗?
程序员最害怕的5件事 你中招了吗?
Google伦敦新总部 犹如星级庄园
Google伦敦新总部 犹如星级庄园
程序员眼里IE浏览器是什么样的
程序员眼里IE浏览器是什么样的
程序员的鄙视链
程序员的鄙视链
10个帮程序员减压放松的网站
10个帮程序员减压放松的网站
初级 vs 高级开发者 哪个性价比更高?
初级 vs 高级开发者 哪个性价比更高?
为什么程序员都是夜猫子
为什么程序员都是夜猫子
“肮脏的”IT工作排行榜
“肮脏的”IT工作排行榜
我是如何打败拖延症的
我是如何打败拖延症的
我跳槽是因为他们的显示器更大
我跳槽是因为他们的显示器更大
程序员的一天:一寸光阴一寸金
程序员的一天:一寸光阴一寸金
做程序猿的老婆应该注意的一些事情
做程序猿的老婆应该注意的一些事情
亲爱的项目经理,我恨你
亲爱的项目经理,我恨你
聊聊HTTPS和SSL/TLS协议
聊聊HTTPS和SSL/TLS协议
老程序员的下场
老程序员的下场
Web开发人员为什么越来越懒了?
Web开发人员为什么越来越懒了?
程序猿的崛起——Growth Hacker
程序猿的崛起——Growth Hacker
5款最佳正则表达式编辑调试器
5款最佳正则表达式编辑调试器
代码女神横空出世
代码女神横空出世
Java程序员必看电影
Java程序员必看电影
那些性感的让人尖叫的程序员
那些性感的让人尖叫的程序员
科技史上最臭名昭著的13大罪犯
科技史上最臭名昭著的13大罪犯
2013年美国开发者薪资调查报告
2013年美国开发者薪资调查报告
什么才是优秀的用户界面设计
什么才是优秀的用户界面设计
如何成为一名黑客
如何成为一名黑客
我的丈夫是个程序员
我的丈夫是个程序员
程序员周末都喜欢做什么?
程序员周末都喜欢做什么?
Web开发者需具备的8个好习惯
Web开发者需具备的8个好习惯
漫画:程序员的工作
漫画:程序员的工作
不懂技术不要对懂技术的人说这很容易实现
不懂技术不要对懂技术的人说这很容易实现
老美怎么看待阿里赴美上市
老美怎么看待阿里赴美上市
如何区分一个程序员是“老手“还是“新手“?
如何区分一个程序员是“老手“还是“新手“?
2013年中国软件开发者薪资调查报告
2013年中国软件开发者薪资调查报告
程序员和编码员之间的区别
程序员和编码员之间的区别
每天工作4小时的程序员
每天工作4小时的程序员
10个调试和排错的小建议
10个调试和排错的小建议
“懒”出效率是程序员的美德
“懒”出效率是程序员的美德
一个程序员的时间管理
一个程序员的时间管理
鲜为人知的编程真相
鲜为人知的编程真相
软件开发程序错误异常ExceptionCopyright © 2009-2015 MyException 版权所有