Question posted in
You can find the official documentation here.

Parameter not populating from Ajax call (Tried everything) – Jquery ajax

Good day everybody.

I have a simple Ajax call. In simplicity, it reads a password from a password field, populates it into a variable, and then sends it across to my StrengthCheck controller. So everything is working perfectly the ajax call makes it into the StregthCheck ActionResult and the ajax success section is fired off hunky-dory. However, the parameter Password in my StrengthCheck actionResult won’t populate with the password sent from my ajax call. I truly believe I’ve tried everything, any input would be greatly appreciated whether it’s a possible solution or even advanced tips to debugging.

Thanks so much in advance, hoping to keep this question as simple as possible.

Script

<script>

    $(document).ready(function () {
        $("#Password").change(function () {
            debugger
            var password = $("#Password").val();

            $.ajax({
                url: '@Url.Action("StrengthCheck", "Login")',
                data: { Password: password },
                dataType:'json',
                type: 'POST',
                success: function (result) {
                    $("#PasswordStrength").val(result);
                    if (result.PasswordStrength != "Blank" && result) {
                        console.log(result);
                        var lblStatus = document.getElementById("PasswordStrength");
                        lblStatus.style.width = result + "%";
                        switch (result)
                            {
                                case "20":
                                    $("#PasswordStrength").removeClass("progress-bar-success").addClass("progress-bar-warning");
                                    break;
                                case "40":
                                    $("#PasswordStrength").removeClass("progress-bar-success").addClass("progress-bar-warning");
                                    break;
                                case "60":
                                    $("#PasswordStrength").removeClass("progress-bar-warning").addClass("progress-bar-success");
                                    break;
                                case "80":
                                    $("#PasswordStrength").removeClass("progress-bar-warning").addClass("progress-bar-success");
                                    break;
                                case "100":
                                    $("#PasswordStrength").removeClass("progress-bar-warning").addClass("progress-bar-success");
                                    break;
                            }

                        }


                    },
                error: function (jqxhr, textStatus, errorThrown) {
                    console.log(jqxhr);
                    console.log(textStatus);
                    console.log(errorThrown);

                },
                    async: true,
                    processData: false

            });

        })



    });



</script>

Login Controller

        [AllowAnonymous]
        [HttpPost]
        public JsonResult StrengthCheck(PhysiotherapyDAL.ViewModels.PasswordResetViewModel data)
        {
            #region password strength
            PasswordScore passwordStrengthScore = PasswordAdvisor.CheckStrength(data.Password); 

            switch (passwordStrengthScore)
            {
                case PasswordScore.Blank:
                    data.PasswordStrength = 0;
                    return Json(JsonConvert.SerializeObject(data.PasswordStrength), JsonRequestBehavior.AllowGet);
                case PasswordScore.VeryWeak:
                    data.PasswordStrength = 20;
                    return Json(JsonConvert.SerializeObject(data.PasswordStrength), JsonRequestBehavior.AllowGet);
                case PasswordScore.Weak:
                    data.PasswordStrength = 40;
                    return Json(JsonConvert.SerializeObject(data.PasswordStrength), JsonRequestBehavior.AllowGet);
                case PasswordScore.Medium:
                    data.PasswordStrength = 60;
                    return Json(JsonConvert.SerializeObject(data.PasswordStrength), JsonRequestBehavior.AllowGet);
                case PasswordScore.Strong:
                    data.PasswordStrength = 80;
                    return Json(JsonConvert.SerializeObject(data.PasswordStrength), JsonRequestBehavior.AllowGet);
                case PasswordScore.VeryStrong:
                    data.PasswordStrength = 100;
                    return Json(JsonConvert.SerializeObject(data.PasswordStrength), JsonRequestBehavior.AllowGet);
                default:
                    break;
            }
            #endregion
            data.PasswordStrength = 0;
            return Json(JsonConvert.SerializeObject(data.PasswordStrength), JsonRequestBehavior.AllowGet);
        }

PasswordResetViewModel

using System;
using System.Collections.Generic;
using System.ComponentModel.DataAnnotations;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

namespace PhysiotherapyDAL.ViewModels
{
   public class PasswordResetViewModel
    {

        [Required(ErrorMessage = "Password required")]
        [DataType(DataType.Password)]
        [Display(Name = "Password")]
        public string Password { get; set; }

        [Display(Name = "Confirm Password")]
        [Required(ErrorMessage = "Confirm password required")]
        [DataType(DataType.Password)]
        [Compare("Password", ErrorMessage = "The two passwords do not match. Please ensure they match.")]
        public string ConfirmPassword { get; set; }

        public string ResetCode { get; set; }

        public string UserID { get; set; }
        
        public bool success { get; set; }

        public int PasswordStrength { get; set; }

    }
}

Here is a screenshot of chrome debugging showing the population of data throughout the ajax call
Screenshot of chrome debugging

Tags:

2

Answers


  1. 0

    HttpPost can receive parameters from the QueryString and the request body.
    By default, primitive types are searched in the query string, where complex types are considered to be in the body.

    Your method is defined to receive Password from the Query String, not the Body. That’s why it stays empty.
    You have 2 ways of solving this.

    • you change your ajax call so that Password is in the query string.
    • you change your method to receive a complex model and leave your ajax
    public class Model {
  public string Password {get; set;}
}
    Login or Signup to reply.
  2. 0

    when nothing worked then use querystring for testing , for this change your url as shown below

     $(document).ready(function () {
    $("#Password").change(function () {
        debugger
        var password = $("#Password").val();

        $.ajax({
            url: '/Login/StrengthCheck?Password='+password ,
            data: {},
            dataType:'json',
          ----
         })

    Method 2.

     $(document).ready(function () {
        $("#Password").change(function () {
            debugger
            var password = $("#Password").val();
            var data={
                       "password" :password ,
                      }
           

            $.ajax({
                url: '/Login/StrengthCheck' ,
                data:Json.Stringify(data),
                dataType:'json',
              ----
             })

    model binder:- https://www.sharpencode.com/article/MVC/model-binders

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search