Question

我想验证在没有回发/刷新的表单中出现的文本框中输入的用户名和密码。我知道我将需要Javascript或AJAX用于此目的，但有人请指导我通过这个参考我任何教程或请在这里解释我的代码。我目前没有此功能的代码如下所示：

@using(Html.BeginForm())
{
    @Html.AntiForgeryToken()
    @Html.TextBoxFor(u => u.PPNumber, new { @class = "form-control", type = "number", placeholder = "Enter Number",@min="1" })
    @Html.ValidationMessageFor(u => u.PPNumber)
    @Html.TextBoxFor(u => u.Password, new { @class = "form-control", type = "Password", placeholder = "Password" })
    @Html.ValidationMessageFor(u => u.Password)
    <input type="submit" value="Login" class="btn btn-primary btn-block" />
}

Answer 1

您可以使用ajax。

当用户提交表单时，您需要在javascript中劫持该事件并停止（阻止正常的整页表单提交），而是使用表单数据对action方法进行ajax调用。此操作方法应具有验证用户凭据的代码，并且可以返回具有status属性的JSON数据结构，该属性指示凭据验证是否成功。您可以在ajax呼叫的成功/ done回调中检查此响应并采取相应措施。

以下是使用jQuery $.post方法的快速示例。

为您的表单添加ID，以便我们可以使用它来连接提交事件。

@using (Html.BeginForm("Login", "Account", FormMethod.Post, new { id="loginForm"))
{
    @Html.TextBoxFor(u => u.PPNumber)
    @Html.TextBoxFor(u => u.Password, new { @class = "form-control", type = "Password"})
    <input type="submit" value="Login" class="btn btn-primary btn-block" />
}

和jj代码劫持提交事件并改为执行ajax帖子。

$(function () {

    $("#loginForm").submit(function(e) {
        e.preventDefault();
        $.post($(this).attr("action"), $(this).serialize())
            .done(function(response) {
                if (response.status === 'success') {
                    alert("Login successful.Do something else now");
                } else {
                    alert("Login failed");
                }
            });
    });
});

假设AccountController中的Login操作方法将返回带有status属性的Json响应。

public ActionResult Login(string PPNumber,string password)
{
    if(PPNumber=="thisIsDemo" && password=="ButDoTheActualCheck")
    {
        return Json(new { status = "success" });
    }
    return Json(new { status = "failed" });
}

这里我只是将usrename / password检查硬编码为2个静态值。您可以更改它以根据您的数据库表/任何您的凭据检查机制进行检查。

在登录表单ASP.NET MVC中验证用户名和密码而不回发

1 个答案: