开发者社区> 范大脚脚> 正文
阿里云
为了无法计算的价值
打开APP
阿里云APP内打开

由jQuery Validation Remote验证引起的错误(MVC3 jQuery.validate.unobtrusive)

简介:
+关注继续查看

出问题的场景:我用MVC3写了一个表单,不管怎么点击都没有反应。因为不是第一次写带validate的表单,所以我确认所有验证都是通过的。

下面是在mvc4默认模版项目中重现错误的示例表单:

image

实际项目中会相对复杂一点,表单也是ajax版本的。

image

现在不管怎么点击Register都不会有错误,也没有反应,同学可以自己下载测试包测试。

image

状态200,一点错误都没有。

这个问题困扰了我两天,没有错误信息的问题最头疼,怎么操作console里都没有任何输出。

往往最后解决问题的方案不是最宝贵的,解决的思路和过程才是,而且也学到了更多的东西,如果看解决方案请移步文章末尾;

这里说下我的经验:

1、对于常用的组件要熟悉熟练熟透,不熟悉开发速度上不来,不熟练没办法调试,不熟透会花更多时间解决问题,我停留在熟悉太久了,所以要抓住每次碰到问题的机会有针对的深入学习一下;

2、时刻保持良好的调试环境,熟悉各种调试工具,很难想象没有这些调试工具的生活;

3、熟悉Http请求,像常用的Post、Get,以及各种数据类型像常用的json、text/html等;

4、脚本语言没有秘密,所以虽然不能像编译型语言那样调试的便利,但是通过脚本的源代码什么问题都能解决;

源代码是王道

碰到这个问题第一步就是打开firebug,这里赞下ch的开发者工具,确实给力,后面的调试基本都在ch里执行的。

因为js基础不扎实,对于jquery管理下的事件还是很头大的,特别是单步后的代码跑来跑去的一点概念没有。

步骤一:先从自己的代码出手,对比两个cshtml页面代码,样本页面是没有问题的,不是不自信,一般稳定的库出错的可能性太小,大家都懂得;

结果:从第一张图应该能看的出来,没有问题,用的合情合理,因为所有引用和使用的技术都在样本页面已经使用过了,这里我注释了很多不同的东西,当然问题还是存在;

步骤二:因为对事件不熟悉,原来的理解也是皮毛,虽然跟c#也是差不多的我还是复习了一遍,《Javascript权威指南》很棒,很全也很深入,感谢淘宝前段团队;

结果:一天时间有一半用在这个上面了,当然途中有复习有搜索等,虽然没解决问题但是这块空白算是补上了,通过调试又看了不少jQuery代码,还是很看不懂啊,jQuery代码质量还是很高的很精简,很全面,内存泄露也有检查。这里要分享的是解决问题要迂回,就算最后没解决但是不会两手空空,侧面的学习更能帮助解决问题,还有就是换个问题或者工作放松下,最后回头解决可能就更清晰了;

步骤三:第二天,前一天没解决的问题,总是会留在脑子里挥之不去,趁无聊的时候从策略层面分析了总结了几种可能,以便于上班后缩小问题范围,验证的错误不是第一次碰到,虽然验证都通过了,但是觉得问题还是出在这个上面的可能性更大,整个上午都在jquery.validate.js和 jquery.validate.unobtrusive.js 这两个文件里度过。

结果:基本了解了validate的结构;

步骤四:定位到关键的地方;

结果:

image

handle()就是执行form.submit()的地方,但是它都上还有个判断,这个判断的作用是防止重复提交,去掉它试试看?嗯,可以提交了,但是问题还没有解决;

 

步骤五:validator.pendingRequest都在哪些地方有操作?为什么没有回到0,0就可以正常handle()了;

结果:validator对象的init,startRequest,stopRequest。太明显了,开始++,结束--,没变0肯定是没--,进一步调试也找到了断裂的地方,jquery.validate.js文件Remote方法ajax结束后调用stopRequest;

原因:jquery.ajax.success除了需要状态过关如304和200这样的外还需要返回的类型符合dataType定义,也就是请求头,否则不会执行success。改正返回类型后一切正常了,搞不明白,stopRequest这么重要的东西怎么能放在success里呢,放done里才对嘛,真搞不懂。



本文转自today4king博客园博客,原文链接:http://www.cnblogs.com/jinzhao/archive/2012/09/20/2695384.html,如需转载请自行联系原作者

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
SQL Server 多表数据增量获取和发布 2.2
数据库环境: 1、SQLServer 2008R2 2、SQLServer 代理打开 一、新建一个数据库 创建数据库 Incremental_DB image.
825 0
SQL Server 多表数据增量获取和发布 3
程序结构 新建一个窗体应用程序,新增三个类库,实现各个层次责任分离 BLL 业务逻辑层 Common 公共帮助类层 Models 模型层 SqlMonitoring SQL监视器程序 image.png 程序设计思路 大概的设计思路是这样的: 1、因为是多表数据增量获取,首先通过配置CDC已经完成多表的捕获配置。
813 0
jQuery Mobile图片轮转轮播
<p>最近一直很忙,刚抽出一点时间,来看了一下camera,非常好用,这里分享一下,与大家共勉!</p> <p></p> <pre code_snippet_id="484636" snippet_file_name="blog_20141015_1_8411998" name="code" class="html">&lt;!DOCTYPE html&gt; &lt;html&gt;
3323 0
Web 开发人员不能错过的 jQuery 教程和案例
  jQuery 把惊喜延续到设计领域,处处带来极大的灵活性,创造了许多体验良好的设计,而且拥有不错的性能。这里分享一组 Web 开发人员不能错过的 jQuery 教程和案例,帮助你更好的掌握 jQuery 在网站实际效果实现中的应用,千万不要错过。
1031 0
[转载] jQuery Mobile 开发 Web App 系列文章目录
首先是jquery mobile api 的中文站点:http://www.jqmapi.com/  然后下面是网上找的一个很好的教程系列文章,转载如下 --------------------------------------------------------------------...
1001 0
mysql_fetch_array()和 mysql_fetch_array()的区别
mysql_fetch_assoc()和 mysql_fetch_array()的区别   mysql_fetch_assoc() 函数从结果集中取得一行作为关联数组。 返回根据从结果集取得的行生成的关联数组,如果没有更多行,则返回 false 提示和注释 注释:mysql_fetch_assoc() 和用 mysql_fetch_array() 加上第二个可选参数 MYSQL_ASSOC 完全相同。
739 0
+关注
3656
文章
0
问答
文章排行榜
最热
最新
相关电子书
更多
低代码开发师(初级)实战教程
立即下载
阿里巴巴DevOps 最佳实践手册
立即下载
冬季实战营第三期:MySQL数据库进阶实战
立即下载