1
我必须使用JQuery执行验证过程。我有两个文本框用户名和密码，两个按钮是登录和提交。我如何点击按钮点击验证消息而不是提交按钮
如果我点击提交按钮，那么它会自动启动验证，以及我必须在登录按钮单击时实现的此功能。
那么我怎么能实现按钮点击自动验证？
为什么我想这样：
- 使用设的JQuery它发送到与用户名和在该时间期间，我将显示处理 密码对服务器的请求....
- 然后，它将通过数据库验证提供的值，并返回 成功或失败，然后我将显示成功或失败。
这里是代码片段：
<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
@Html.ValidationSummary(true, "Login was unsuccessful. Please correct the errors and try again.")
@using (Html.BeginForm(null, null, FormMethod.Get, new { id = "Form1", name = "Form1" }))
{
<table>
<tr>
<td>
User Name
</td>
<td>@Html.TextBoxFor(u => u.UserName, new { id = "txtUser" }) @Html.ValidationMessageFor(u => u.UserName)
</td>
</tr>
<tr>
<td>
Password
</td>
<td>@Html.TextBoxFor(u => u.Password, new { id = "txtPassword" }) @Html.ValidationMessageFor(u => u.Password)
</td>
</tr>
<tr>
<td>
</td>
<td>
<input type="button" value="Login" onclick="checkAuthentication();" />
<input type="submit" value="Submit" />
</td>
</tr>
<tr>
<td colspan="2">
<div id="dvStatus" class="loginMessageStatus">
</div>
</td>
</tr>
</table>
}
<script language="javascript" type="text/javascript">
function getUserCredentials() {
var user = jQuery('#txtUserName').val();
var pass = jQuery('#txtPassword').val();
return { UserName: user, Password: pass };
}
function clearUserCredentials() {
jQuery('#txtUserName').val("");
jQuery('#txtPassword').val("");
jQuery('#txtUserName').focus();
}
function checkAuthentication() {
jQuery('#dvStatus').html("<div class='requestProcess'></div><div class='requestMessage'>Please wait...</div>")
var postData = getUserCredentials();
var ajaxResponse = $.ajax({
type: "post",
url: '@Url.Action("Index", "Login")',
dataType: 'json',
contentType: "application/json; charset=utf-8",
data: JSON.stringify(postData),
success: function (result) {
var res = jQuery.parseJSON(result);
if (res.Success == true) {
jQuery('#dvStatus').html("<div class='requestSuccess'></div><div class='requestMessage'>Your are successfully logged in. Redirecting...</div>")
jQuery.doTimeout(100, redirectToPage);
}
else {
jQuery('#dvStatus').html("<div class='requestFailed'></div><div class='requestMessage'>Error: " + res.Message + ". <a href='javascript:void(0)' onclick='clearUserCredentials()'>Try Again</a></div>")
}
}
});
}
function redirectToPage() {
href = '@Url.Action("Index", "TabMaster")';
window.location.href = href;
}
注： -
- 验证完全与工作Submit按钮
- 验证过程与登录按钮完全正常工作（只是我必须整合验证与登录按钮）
它看起来像代码会工作，你找控制器上的代码？我不确定你在找什么？ – Steve
没有必要在问题标题中加入[[解决]]。只要接受你自己的答案（如果可以的话），这将在主页上标记问题，以便每个人都可以看到它的状态。 – ChrisF
好评，不幸的是它会给我留言**“你可以在2天内接受你自己的答案”**所以决定保留至少两天解决方案，然后我会将其提交给正确答案。 – imdadhusen