ASP.NET MVC 客户端验证陷入无限循环
我们在 MVC2 项目中遇到客户端验证问题。
有一个视图模型包含以下属性
[Required(ErrorMessage = "First Name is required")]
public string FirstName { get; set; }
在相应的视图中,我们有
<% using (Html.BeginForm("Save", "User", FormMethod.Post))
{
%>
<!-- code removed -->
<%= Html.ValidationMessageFor(model => model.UserInfo.FirstName)%>
<%= Html.TextBoxFor(model => model.UserInfo.FirstName)%>
<!-- code removed -->
<% } %>
当用户点击表单提交按钮并且 FirstName
为空时,就会出现问题。浏览器(本例中为 IE8)挂起,无限循环执行 JavaScript。
如果我们删除 Required
属性,那么问题就不会出现(但当然我们看不到验证错误消息)。
JavaScript 的违规部分位于 MicrosoftAjax.debug.js 中,位于
var $addHandler = Sys.UI.DomEvent.addHandler = function Sys$UI$DomEvent$addHandler(element, eventName, handler) {
以下部分的函数中。有关详细信息,请参阅内嵌注释
else if (element.attachEvent) {
browserHandler = function() {
var e = {}; // we end up back here...
try {e = Sys.UI.DomElement._getWindow(element).event} catch(ex) {}
return handler.call(element, new Sys.UI.DomEvent(e)); // ...when this line executes
}
element.attachEvent('on' + eventName, browserHandler);
}
可能是什么原因造成的?
We're having a problem with client-side validation in an MVC2 project.
There is a view model containing the following property
[Required(ErrorMessage = "First Name is required")]
public string FirstName { get; set; }
In the corresponding view we have
<% using (Html.BeginForm("Save", "User", FormMethod.Post))
{
%>
<!-- code removed -->
<%= Html.ValidationMessageFor(model => model.UserInfo.FirstName)%>
<%= Html.TextBoxFor(model => model.UserInfo.FirstName)%>
<!-- code removed -->
<% } %>
The issue arises when the user hits the form submit button and FirstName
is empty. The browser (IE8 in this case) hangs up, executing JavaScript in an infinite loop.
If we delete the Required
attribute then the problem does not arise (but of course we don't see the validation error message).
The offending section of JavaScript is in MicrosoftAjax.debug.js
, in the function
var $addHandler = Sys.UI.DomEvent.addHandler = function Sys$UI$DomEvent$addHandler(element, eventName, handler) {
in the following section. See the inline comments for details
else if (element.attachEvent) {
browserHandler = function() {
var e = {}; // we end up back here...
try {e = Sys.UI.DomElement._getWindow(element).event} catch(ex) {}
return handler.call(element, new Sys.UI.DomEvent(e)); // ...when this line executes
}
element.attachEvent('on' + eventName, browserHandler);
}
What could be causing this?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
经过一番调查,发现此问题的发生是由于表单的
TextBoxFor
s 位于 HTML 表格中(是的,用于布局的表格 - 该页面是 10 年前的 asp 的副本)正在停用的页面)。解决此问题的方法是添加一个解决方法,将
style = "table-layout:fixed;"
添加到声明中。
更多详细信息请参见 http://forums.asp.net/p/1515784/3826207。 ASPX
Following some investigation, it was found that this issue happens due to the
TextBoxFor
s of the form being within an HTML table (yes, tables for layout - this page is a copy of a ten-year old asp page that was being decomissioned).The fix for this was to add a workaround of adding
style = "table-layout:fixed;"
to the<table>
declaration.Some more details are at http://forums.asp.net/p/1515784/3826207.aspx