jQuery Mobile 和非侵入式验证
我正在创建一个基于 jQuery Mobile (Alpha 3) 的 <一个 href="http://www.asp.net/mvc/mvc3" rel="nofollow">ASP.NET MVC 3 应用程序,利用 MVC3 附带的不显眼的验证。当直接访问页面时(URL 中没有哈希值),验证工作正常。但是,当您导航到该页面时,jQuery Mobile 使用 Ajax 导航来动态加载该页面(在 Url 中显示哈希值),并且验证将停止工作。
以下是正在使用的代码示例:
模型:
[Required(ErrorMessage = "Missing value")]
[DisplayName("Property Display Name")]
public int? PropertyName { get; set; }
视图(Razor):
@Html.LabelFor(model => model.PropertyName)
@Html.TextBoxFor(model => model.PropertyName)
@Html.ValidationMessageFor(model => model.PropertyName)
生成的 HTML:
<label for="PropertyName">Property Display Name</label>
<input data-val="true" data-val-number="The field Property Display Name must be a number." data-val-required="Missing value" id="PropertyName" name="PropertyName" type="text" value="" />
<span class="field-validation-valid" data-valmsg-for="PropertyName" data-valmsg-replace="true"></span>
可能已加载其他页面以前,HTML 元素不再具有唯一的 ID。除了滚动我自己的 Html Helper 类来生成 Label、TextBox 和 ValidationMessage 的 HTML 之外,还有其他方法可以处理这种情况吗?
I'm creating a jQuery Mobile (Alpha 3) based ASP.NET MVC 3 application utilizing the unobtrusive validation that comes with MVC3. When a page is accessed directly (no hash in the Url), validation works perfectly. However, when you navigate to the page, jQuery Mobile uses Ajax Navigation to dynamically load it (displaying the hash in the Url) and validation stops working.
Here is a sample of the code in use:
Model:
[Required(ErrorMessage = "Missing value")]
[DisplayName("Property Display Name")]
public int? PropertyName { get; set; }
View (Razor):
@Html.LabelFor(model => model.PropertyName)
@Html.TextBoxFor(model => model.PropertyName)
@Html.ValidationMessageFor(model => model.PropertyName)
Generated HTML:
<label for="PropertyName">Property Display Name</label>
<input data-val="true" data-val-number="The field Property Display Name must be a number." data-val-required="Missing value" id="PropertyName" name="PropertyName" type="text" value="" />
<span class="field-validation-valid" data-valmsg-for="PropertyName" data-valmsg-replace="true"></span>
It is possible that other pages have been loaded previously and the HTML elements no longer have unique Ids. Other than rolling my own Html Helper class to generate the HTML for the Label, TextBox, and ValidationMessage, is there any way to handle this scenario?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(3)
我一直在解决同样的问题,但@Zote 为我指明了正确的方向。
parse()
是可行的方法,但请确保传入选择器,即:或
连接此的最佳方法可能是通过 JQM
pageshow
事件。然后,这将在每次新页面转换后触发,如下所示,您可能还希望在 jqm 在页面上完成它的魔力之前通过使用
pagebeforeshow
事件来执行此操作.ui-page-active,您可以将搜索范围缩小到当前活动页面。I've been struggling a bit with this same issue, but @Zote pointed me in the right direction.
parse()
is the way to go, but make sure to pass in a selector ie:or
The best way of hooking this up is probably through JQMs
pageshow
event. This would then be triggered after each new page transition, like so, You may also prefer to do this before jqm has done it's magic on the page as well by using thepagebeforeshow
eventBy using the
.ui-page-active
, you narrow your search down to the currently active page.加载新内容后您是否调用了 jQuery.validator.unobtrusive.parse() ?
请阅读 Brad Wilson 博客上的这篇文章。
Did you call
jQuery.validator.unobtrusive.parse()
after loaded new content?Read this post at Brad Wilson's blog.
我解决了遇到的同样问题,我的答案发布在这里 -
将 jquery mobile 与 asp.net mvc2 结合使用时出现哈希导航问题
I solved the same problem I encountered, my answer is posted here -
Hash navigation problem while using jquery mobile with asp.net mvc2