如何使用远程方法检查用户名和密码验证?

时间:2015-07-31 04:27:00

标签: jquery asp.net-mvc jquery-validate

我们正在开发MVC.net应用程序,点击登录按钮用户名和密码需要在服务器端验证。我们正在那里使用表单身份验证。页面流是这样的......

用于客户端验证的JQuery验证插件,如果客户端验证通过,则向AJC调用MVC控制器以验证用户名和密码。在控制器操作中,我们需要传递三个参数Username,Password和RemeberMe。如果它是有效的,那么它将返回目标URL作为JSON结果,并且从客户端它将重定向到该控制器。 如果它无效,则显示错误消息。

我们在这里为客户端验证编写以下代码'.login-form',用于所有这些控件都可用的表单。我需要为此编写远程方法,但不知道如何编写它。 控制器操作URL是“登录/验证用户”,并在发送后发送用户名,密码和记住。你能否提供一些代码示例如何在jQuery Validation插件中的远程方法参数中实现这一点

$('.login-form').validate({
        errorElement: 'span', //default input error message container
        errorClass: 'help-block', // default input error message class
        focusInvalid: false, // do not focus the last invalid input
        rules: {
            username: {
                required: true,
                username:true,
                "remote":
            {
                **//need to write AJAX call here..**
            }
            },
            password: {
                required: true
            },
            remember: {
                required: false
            }
        },
        messages: {
            username: {
                required: "Username is required.",remote: "Username and password is invalid"
            },
            password: {
                required: "Password is required."
            }
        },

2 个答案:

答案 0 :(得分:1)

  remote: {
    url: "controller/action",
    type: "post",
    data: {
      username: function() {
        return $( "#username" ).val();
      }
    }
  }

http://jqueryvalidation.org/remote-method请参阅此文档

设置选项,它会自动执行ajax,你不需要自己编写ajax请求

答案 1 :(得分:-1)

我更改了UI设计以提交表单。而不是提交按钮我使用简单的类型="按钮"并在该点击上调用以下代码....

LoginClick = function () {

    if ($('.login-form').valid()) {

        var userName = $('[name=username]').val();
        var password = $('[name=password]').val();
        var rememberMe = $('[name=remember]').val();

        //$('.alert-danger', $('.login-form')).show();

        $.ajax({
            url: "/account/validateuser",
            type: "POST",
            data: JSON.stringify({ UserName: userName, Password: password, IsRememberMe: rememberMe }),
            dataType: "json",
            contentType: "application/json",
            success: function (status) {
                //$("#message").html(status.Message);
                if (status.Success) {
                    window.location.href = status.TargetURL;
                }
            },
            error: function () {
                $("#message").html("Error while authenticating user credentials!");
            }
        });
    }
};

如果所有字段都有效,那么我调用ajax调用,然后将用户重定向到请求的页面。