Net Core Ajax Jquery Passing Null Value to Controller, Vs2022, .Net 6

Question

I tried Different forms of calls, same names, with stringify, without stringify.... but nothing works.

my html

<input type="text" id="txtName"/>
<input type="button" id="btnGet" value="Get Current Time"/>
<input type="text" id="txtresponse"/>

my jscript

$(function () {
            $("#btnGet").click(function () {
                $.ajax({
                    type: "POST",
                    url: "/Home/AjaxMethod",
                    data: '{name: "' + $("#txtName").val() + '" }',
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function (response) {
                        //alert(response);
                        $("#txtresponse").val(response);
                    },
                    failure: function (response) {
                        alert(response.responseText);
                    },
                    error: function (response) {
                        //alert(response.responseText);
                    }
                });
            });
        });

my controller

[HttpPost]
public ContentResult AjaxMethod(string name)
{
    string currentDateTime = string.Format("Hello {0}.\nCurrent DateTime: {1}", 
                                                      name, DateTime.Now.ToString());
    return Content(currentDateTime);
}

Here, the "AjaxMethod" controller always receives null as the value of the "name" parameter.

My Version is .Net 2022 and .Net 6

Thank you very much for your help

Rena · Accepted Answer · 2022-07-12 02:48:07Z

ASP.NET 6 MVC receives the application/x-www-form-urlencoded type data by default if you do not specify(e.g use [FromBody]/[FromQuery]) the source.

Change your code like below:

$(function () {
    $("#btnGet").click(function () {
        $.ajax({
            type: "POST",
            url: "/Home/AjaxMethod",
            data: { name: $("#txtName").val() },      //change here....
  //contentType: "application/json; charset=utf-8",   //remove it
                                                      // default is application/x-www-form-urlencoded
            dataType: "json",
            success: function (response) {
                //alert(response);
                $("#txtresponse").val(response);
            },
            failure: function (response) {
                alert(response.responseText);
            },
            error: function (response) {
                //alert(response.responseText);
            }
        });
    });
});

bg_smooove · Accepted Answer · 2022-07-11 18:43:33Z

0

You don't need to concatenate a string to send data to the controller using AJAX. You can simply give it a javascript object to send. Try the following:

$(function () {
            $("#btnGet").click(function () {
                $.ajax({
                    type: "POST",
                    url: "/Home/AjaxMethod",
                    data: {
                        name: $("#txtName").val() 
                    },
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function (response) {
                        //alert(response);
                        $("#txtresponse").val(response);
                    },
                    failure: function (response) {
                        alert(response.responseText);
                    },
                    error: function (response) {
                        //alert(response.responseText);
                    }
                });
            });
        });

answered Jul 11, 2022 at 18:43

bg_smooove

912 silver badges8 bronze badges

1 Comment

cecy vargas Over a year ago

thanks, try your modification and still the same, returning null...

Serge · Accepted Answer · 2022-07-12 00:34:43Z

0

you can create model class

public class NameModel
{
  public string Name {get; set;}
}

fix ajax data

 data: JSON.stringify({ name:$("#txtName").val() }),

and add frombody attribute to the action

public ContentResult AjaxMethod([FromBody]NameModel model)
{
  var name=model.Name;
  ... another your code
}

or leave action as it is but remove "application/json; charset=utf-8" contentType from ajax

 $.ajax({
                    type: "POST",
                    url: "/Home/AjaxMethod",
                    data: {name:  $("#txtName").val() },
                    ....

answered Jul 12, 2022 at 0:34

Serge

44.4k4 gold badges26 silver badges53 bronze badges

Collectives™ on Stack Overflow

Net Core Ajax Jquery Passing Null Value to Controller, Vs2022, .Net 6

3 Answers 3

Comments

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related