提问人:Scott 提问时间:2/23/2011 更新时间:2/23/2011 访问量:2228
MVC 3 不显眼的 javascript 验证,当文本框具有默认值时
MVC 3 unobtrusive javascript validation when textbox has a default value
问:
因此,我有一个与 MVC 3、DataAnnotations 和 Unobtrusive javascript 配合得很好的表单。但是,我想在输入字段上添加“水印”,以便例如,默认情况下,“名字”文本框填充的值为“名字”。当用户单击它时,该值将消失,如果他们在不输入任何内容的情况下离开该字段,则“名字”将再次出现。此外,我已经实现了这一点并且运行良好。
我的问题与视图模型的 FirstName 属性上的属性有关。如果用户提交表单,则默认情况下,该字段包含“名字”,因此它通过了“必需”验证。[Required]
处理这个问题的最佳方法是什么......我正在考虑几个选择:
1)注入一些jQuery,以便在清除水印的不显眼的JS验证之前触发,这样当验证触发时,那些具有默认值的字段是空白的。我不确定这是否可能。你能在不显眼的 JS 运行其验证之前以某种方式注入一个函数吗?
2) 修改 [Required] 属性或创建一个新属性以接受默认值,然后进行比较以查看它们是否匹配。这引发了一些问题,因为我现在在多个地方指定了我的默认值,一个在 UI 中,一个在代码中,这感觉不对。
3)创建一个新的“水印”属性,我用它来装饰属性,该属性指定该字段的默认值。创建一个新的 HTML 帮助程序(而不是 TextBoxFor),用于查找此属性并将相应的属性发送到标记。修改或创建新的 [Required] 属性,以查找同一字段上是否存在 [Watermark]。这将“默认值”保持在一个地方并遵循 DRY 原则,但感觉就像我把 UI 元素放入代码中(水印纯粹是视觉的),而且对于应该是一个简单的问题来说,它也感觉像是一个过于复杂的解决方案。
有什么想法吗?
答:
我可能会选择#2,我认为您可以以这样一种方式进行操作,即您不需要多次指定默认值。此外,如果要验证用户名是否未被占用,则可以使用远程验证,然后检查该名称是否已被占用或为默认名称,以便您可以免费获得所需的行为。
每个都有其优点/缺点。我喜欢保留这个客户端,并使用了以下内容。
使用 HTML5 占位符属性,对于支持它的浏览器,您不必再这样做了。
<input type="text" placeholder="First name" />
对于不...
在每个页面上,我们都有一些不支持某些功能的浏览器的兼容性脚本。在本例中,使用少量 JavaScript 和 jQuery 来检测浏览器是否支持该属性。如果没有,则将字段值设置为占位符值,设置样式并添加相应的焦点/模糊事件处理程序。focus/blur 事件处理程序适当地设置字段值。placeholder
然后,在客户端验证脚本上,检查字段值是否不等于占位符值。
在您的例子中,这意味着修改不显眼的 JS 验证以检查字段值不等于占位符值
评论