You must Sign In to post a response.
  • Category: JQuery

    How to use remote method to check username and password validation?

    We are working on MVC.net application where on click login button username and password need to validate on server side. We are using Form authentication over there. Page flow is like this…

    JQuery validation plug-in used for client side validation, if client validation pass then make AJAX call to MVC controller to validate username and password. In controller action, we need to pass three parameters Username, Password and RemeberMe. If it is valid then it will return target URL as JSON result and from client side it will redirect to that controller. If it is not valid then show error message.

    We write following code for client validation here '.login-form' for form where all these controls are available. I need to write remote method for this but no idea how to write that. Controller Action URL is "Login/ValidateUser" and in post send username, password and remeber

    $('.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."
    }
    })
  • #761087
    1. You do not need to create another action for validation
    2. In the model you can specify the attribute as like bellow
    [Required]
    [Display(Name = "User Name")]
    [EmailAddress]
    public string Email { get; set; }

    3. In your post action you can validate your model
    ModelState.IsValid

    By Nathan
    Direction is important than speed

  • #761089
    Hi
    Anukash

    You can refer this code for validation in mvc



    //[Required]
    // public int EmpId { get; set; }
    // [Required(ErrorMessage="The Employee is Empty")]
    // public string EmpName { get; set; }
    // [DataType(DataType.PhoneNumber)]
    // [Phone]
    // public int PhoneNo { get; set; }
    // [DataType(DataType.EmailAddress)]
    // [EmailAddress]
    // public string EmailId { get; set; }


    You can go through Article link in our Site

    http://www.dotnetspider.com/resources/46184-How-to-Implement-Client-side-validation-in-MVC5-using-Model-class-and-Json.aspx

    Name : Dotnet Developer-2015
    Email Id :kumaraspcode2009@gmail.com

    'Not by might nor by power, but by my Spirit,' says the LORD Almighty.

  • #761093
    Hello Ankush,

    Refer the below links :

    http://formvalidation.io/validators/remote/

    http://www.dotnetspider.com/resources/46184-How-to-Implement-Client-side-validation-in-MVC5-using-Model-class-and-Json.aspx

    http://jqueryvalidation.org/remote-method/

    https://forum.jquery.com/topic/using-the-remote-method-with-an-asp-file-to-check-if-a-user-exists

    Hope this will help you.

    Regards,
    Nirav Lalan
    DNS Gold Member
    "Failure is the path of least persistence"

  • #761117
    I changed UI design to submit form. Instead of Submit button I use simple type="button" and call following code on that click....

    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!");
    }
    });
    }
    };

    Here if all fields are valid then I call ajax call then redirect user to requested page.


Sign In to post your comments