论坛首页 Web前端技术论坛

【prototype学习】基于prototype的表单验证(二)

浏览 23755 次
精华帖 (0) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (0)
作者 正文
   发表时间:2006-12-12  
上次在javaEye上看到了一个有关验证的帖子后,感觉和我的想法很相似,就着手做了扩展,
http://www.iteye.com/topic/36302做得比较简单,因为当前的项目只要求在IE下OK,也没仔细改进,该帖子发出以后,有人推荐了国外的一个验证框架,以前我也看到过,当时没发现其亮点,而且功能上实在太简单,无法胜任平时的验证,几乎只是一些不带参数的格式验证,如数字、字母等等,再者有人大力推荐国人badqiu对其做的扩展,做得很不错,几乎能胜任我所遇到的所有验证:
1、每个验证规则需重复考虑是否为空
2、老外本身没考虑国际化,所以框架中把默认错误信息和验证规则绞合在一起。
3、badqiu做了验证规则的depends扩展,如validate-in-rang 规则 回在其验证之前进行 validate-integer 的验证,由于是在老框架上做这样的处理,使得代码可读性下降很多。
4、该框架没有把验证的逻辑和各种帮助函数很好的分开,使得整个逻辑部分不够集中,代码可读性和条理上不够清爽。
5、validation验证器内部传递参数过于复杂,很多地方都是需要几个参数就传几个参数这样而不是把整个实例的引用传过去,导致代码阅读比较费力。
6、命名上validation验证器把每个验证规则称为 validator 整个验证器称为 validation 区别不是很明了,而我的理解是元素classname中每个name对应的是一条规则而已,所以easyvalidation中使用的是rule,且我把整个验证相关的部分都封装在easyvalidation命名空间之内。
另外我针对 radio checkbox 和 select 实现了 选项数目的范围等验证.对照myvalidator做
了个相应的demo 。把badqiu和老外(andrew)的验证demo 分别对应做了一下
(个别不一定配置全部正确 时间和精力的关系,今天刚完成),并且把几种不同配置下的demo做成了单独的页面,针对一些特别的html tag,老外和badqiu的在这上面,我用的时候觉得应该改进,所以做了修改,实现效果会不一样。
    做这个东西,并不带什么目的性(自己能用上 ),只是拿出来和大家作为一个学习上的交流而已,我这段时间在学习javascript,想针对prototype做一些东西练练手,刚好验证这一块也是我很感兴趣的.
   这个东西如有不完善之处,希望有兴趣的朋友发现后能给予说明。

PS:一有最新的我就放到这里来哦 我回更改日期的
20070126


20080815

2008081523
针对select radio checkbox的验证效果也做了改良 各位可以看看 还不满意的 请提意见 谢谢:)

  • 20080815.rar (30 KB)
  • 描述: 进行了各个文件的分离,吸收了一些朋友提出的问题
  • 下载次数: 209
  • 2008081523.rar (30.3 KB)
  • 描述: 比较完整好用了 嘿嘿
  • 下载次数: 666
   发表时间:2007-01-19  
主目录下面还有三个文件夹,能不能说明一下那些是做什么用的?
0 请登录后投票
   发表时间:2007-01-19  
validation1.5.3 是官方的项目文件(老外的)
validation1 是badqiu的项目文件
myvalidator 是我扩展的表单验证(一)的项目(对我而言 )文件

现在easyvalidation在我平时的使用中还是很方便的,不过这个帖子上的东西比较乱,我有时间了会整理一下的,现在又加了几条规则。

我打算把规则函数提出来,提出来感觉使用上更方便。
再把demo做得清晰实用点,现在的是第一次写很乱,而且因为后期的修改有一些错误在里面。
0 请登录后投票
   发表时间:2007-01-21  
今天陪女友值班顺便整理了一下,把 demo简化成只有一个了,先放上来,欢迎有尝试的朋友提意见或批评哦 

已放在主贴
0 请登录后投票
   发表时间:2007-01-21  
下载来看了,感觉很不错。
发现对我的项目很有用,在认真的学习中。
希望楼主可以开发更具有挑战性的东西。
0 请登录后投票
   发表时间:2007-01-22  
Hi 总楼主,我再使用您的类库的时候发现一个问题:
问题描述,密码验证问题:
比如你在例子中是这样的。
  <tr>
   <td>密码:</td><td><input name="password" id="password" class='required' ></td>
  </tr>
  <tr>
   <td>elm-equals-password:</td><td><input name="passwordRepeat" id="passwordRepeat" class='required elm-equals-password' ></td>
  </tr>
这样是没问题的
我吧其中
tr>
   <td>密码:</td><td><input name="password" id="password" class='required' ></td>
  </tr>

name="password" id="password"
改为member.password ,然后点提交的时候就没反应,
里面提示js错误说tagname不时对象或者时没定义

能解决吗?
0 请登录后投票
   发表时间:2007-01-23  
wuhua 写道
Hi 总楼主,我再使用您的类库的时候发现一个问题:
问题描述,密码验证问题:
比如你在例子中是这样的。
  <tr>
   <td>密码:</td><td><input name="password" id="password" class='required' ></td>
  </tr>
  <tr>
   <td>elm-equals-password:</td><td><input name="passwordRepeat" id="passwordRepeat" class='required elm-equals-password' ></td>
  </tr>
这样是没问题的
我吧其中
tr>
   <td>密码:</td><td><input name="password" id="password" class='required' ></td>
  </tr>

name="password" id="password"
改为member.password ,然后点提交的时候就没反应,
里面提示js错误说tagname不时对象或者时没定义

能解决吗?



elm-equals-password

这个password也需要改成member.password ,谢谢提出问题,我会改进的。
0 请登录后投票
   发表时间:2007-01-24  
在firefox2.0.0.1下无法正常使用,交验效果一点都没出来
0 请登录后投票
   发表时间:2007-01-24  
billy119 写道
在firefox2.0.0.1下无法正常使用,交验效果一点都没出来


我的firefox是这样的

Mozilla/5.0 (Windows; U; Windows NT 5.1;
en-US; rv:1.8.0.8) Gecko/20061025
Firefox/1.5.0.8

能进行验证啊 你指的是根目录下的还是里面那些目录下的demo啊?

我再把最新的demo发一下,前面的过段时间我就把他删掉
0 请登录后投票
   发表时间:2007-01-24  
我原来运行的就是根目录下的,不过现在运行最新的就没有问题了:)
还想提点建议就是像Zapatec AJAX Forms那样
1.图片提示
2.输入框限制提示例如:
___-____
Zapatec AJAX Forms的运行速度比较慢
0 请登录后投票
论坛首页 Web前端技术版

跳转论坛:
Global site tag (gtag.js) - Google Analytics