我必須使用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