未使用Javascript，并且在提交带有附加模型的表单时出现对象引用错误
Javascript not being used and object reference error on submit of form with attached model
我正在为一个在后台数据库中更新用户密码的网站进行密码重置功能。我成功地能够通过输入强密码即Password123更改用户密码!当输入密码不够弱时，即abc，但当我输入密码和确认不匹配时，即Password123, MVC架构是足够快乐的!和Password1234 !然后我得到一个错误，与以下行对象引用错误有关:
@using (Html.BeginForm("Reset", "Reset", new { qString = Model.QueryString } ))
下面是我的代码全文:
@{
ViewBag.Title = "Index";
Layout = "~/Views/Shared/_Layout.cshtml";
}
@model ......ResetModel
<script type="text/javascript">
$(document).ready(function () {
$('#close').click(function (event) {
closeAjax();
event.cancelBubble = true;
event.returnValue = false;
event.preventDefault();
event.stopPropagation();
});
});
$(document).ready(function () {
$("#index").validate({
rules: {
password: {
required: true, minlength: 6
},
confirmpassword: {
required: true, equalTo: "#password", minlength: 6
}
},
messages: {
password: "Please enter your new password.",
c_password: "Please confirm your new password."
}
});
});
</script>
<div class="form_container">
<div class="logo">
<a href=""><img class="logo" src="@Url.Content("~/Content/SP_Logo_white.png")" alt="Cloud"/></a>
</div>
<div class="reset">
<h3>Password Reset</h3>
<div class="reset-help">
<p>Forgot your password? Use the form to change or reset your password.</p>
</div>
@using (Html.BeginForm("Reset", "Reset", new { qString = Model.QueryString } ))
{
<label for="reset">UserName:</label>
<input type="text" id="username" name="username" /><br />
<label for="password">New Password:</label>
<input type="password" id="password" name="password" /><br />
<label for="confirmpassword">Confirm Password:</label>
<input type="password" id="confirmpassword" name="confirmpassword" />
<p><input type="submit" id="submit" value="Submit" /></p>
}
</div>
</div>
有人可以帮助我理解为什么只有当密码不匹配时才会发生这种情况，我也无法理解为什么我的javascript验证没有被设置
呈现的HTML如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Password Reset</title>
<link href="/Content/Site.css" rel="stylesheet" type="text/css" />
<script src="/Scripts/jquery-1.5.1.min.js" type="text/javascript"></script>
<script src="/Scripts/modernizr-1.7.min.js" type="text/javascript"></script>
</head>
<body>
<img src="/2.jpg" alt="Big Pic" class="bg" />
<div class="top_40"></div>
<section id="main">
<script type="text/javascript">
$(document).ready(function () {
$('#close').click(function (event) {
closeAjax();
event.cancelBubble = true;
event.returnValue = false;
event.preventDefault();
event.stopPropagation();
});
});
$(document).ready(function () {
$("#index").validate({
rules: {
password: {
required: true, minlength: 6
},
c_password: {
required: true, equalTo: "#password", minlength: 6
}
},
messages: {
password: "Please enter your new password.",
c_password: "Please confirm your new password."
}
});
});
</script>
<div class="form_container">
<div class="logo">
<a href=""><img class="logo" src="/Content/SP_Logo_white.png" alt="Cloud"/></a>
</div>
<div class="reset">
<h3>Password Reset</h3>
<div class="reset-help">
<p>Forgot your password? Use the form to change or reset your password.</p>
</div>
<form action="/Reset/Reset?qString=qKkQBXYEsY0GthEqFIuWYfXQ1CKcUioxpbY8vfhqN9nlOcHrZdLIYzxxhtV0YK73" method="post"> <label for="reset">UserName:</label>
<input type="text" id="username" name="username" /><br />
<label for="password">New Password:</label>
<input type="password" id="password" name="password" /><br />
<label for="confirmpassword">Confirm Password:</label>
<input type="password" id="confirmpassword" name="confirmpassword" />
<p><input type="submit" id="submit" value="Submit" /></p>
</form> </div>
</div>
</section>
<div class="bottom_80"></div>
</body>
</html>
你有几个主要的问题会阻止jQuery Validate插件的运行。
1)您还没有将验证插件script包含到您的代码中。在之后的某个地方，你的jquery script包含，你应该有这样的东西…
<script src="/Scripts/jquery.validate.min.js" type="text/javascript"></script>
2)您已将.validate()连接到$('#index')。我在你的页面上没有看到id="index"。如果想让.validate()正常工作，index需要是form元素的id。例子:
:
$(document).ready(function() {
$('#formID').validate({
...