Jquery Ajax call passed parameter always null in Asp.net MVC Core

问题

I am migrating my MVC application to Asp.Net core (3.1 version) application. I have one layout page which is used for menu navigation. When user click on any menu then i need to pass some value from Layout to the controller for some business purpose. To do that i used one ajax call here.

Below ajax call code is working fine in MVC, But in Asp.Net core the passed parameter value is null in controller.

Working code of MVC:

function SetCurrentPageNameSession(currentPageName, isBookMarkPage) {

        if(isBookMarkPage==undefined)
            isBookMarkPage = false;
        var url = baseUrl+"Manage/HighlightCurrentMenu/"
            $.ajax({
            type: "POST",
            data: "{'CurrentPage':'" + currentPageName + "', 'IsBookMark':'" + isBookMarkPage + "'}",
                url: url,
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                async:false,
                success: function (data) {
                var res = data.d;
            },
                error: function (xhr, ajaxOptions, thrownError) {

            }
        });
    }

and below is the controller action method where i get these passed value:

[HttpPost]
        public IActionResult HighlightCurrentMenu(string CurrentPage, bool IsBookMark)
        {
           return Json(true);
        }

When the same code not works in Asp.Net core then i googled it and found like need to modify the ajax call code.

I modified data section in below:

function SetCurrentPageNameSession(CurrentPage, IsBookMark) {

        var url = baseUrl+"Manage/HighlightCurrentMenu/"
            $.ajax({
            type: "POST",
            data: JSON.stringify({ CurrentPage: CurrentPage, IsBookMark: IsBookMark }),
                url: url,
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                async:false,
                success: function (data) {
                var res = data.d;
            },
                error: function (xhr, ajaxOptions, thrownError) {

            }
        });
    }

And used FromBody in controller action method:

[HttpPost]
        public IActionResult HighlightCurrentMenu([FromBody] string CurrentPage, [FromBody] bool IsBookMark)
        {
          return Json(true);  
        }

I get the value null in "CurrentPage" Parameter.

I tried one more scenario by myself in below:

data: JSON.stringify("{'CurrentPage':'" + CurrentPage + "', 'IsBookMark':'" + IsBookMark + "'}"),

In this case i get complete Json format value in "CurrentPage" parameter inside action method

Below is the screen shot for the same.

Please suggest.

回答1:

in Asp.Net core the passed parameter value is null in controller

From this doc, you could find:

Don't apply [FromBody] to more than one parameter per action method. Once the request stream is read by an input formatter, it's no longer available to be read again for binding other [FromBody] parameters.

To achieve your requirement of passing multiple data from JS client side to controller action method, you can try following code snippet.

[HttpPost]
public IActionResult HighlightCurrentMenu([FromBody]PageInfo pageInfo)
{
    var currentPage = pageInfo?.CurrentPage;
    var isBookMark = pageInfo?.IsBookMark;

    //...
    //code logic here

    return Json(true);
}

PageInfo class

public class PageInfo
{
    public string CurrentPage { get; set; }
    public bool IsBookMark { get; set; }
}

On JS client side

data: JSON.stringify({ "CurrentPage": CurrentPage, "IsBookMark": IsBookMark }),

Test Result

回答2:

You probably don't need to specify that you are sending the json. I have tried the below and it worked

function SetCurrentPageNameSession(currentPageName, isBookMarkPage) {
    if(isBookMarkPage==undefined)
        isBookMarkPage = false;
    var url = baseUrl+"Manage/HighlightCurrentMenu/"
        $.ajax({
        type: "POST",
            data: { CurrentPage: currentPageName, IsBookMark: isBookMarkPage },
            url: url,
            success: function (data) {
            var res = data.d;
        },
            error: function (xhr, ajaxOptions, thrownError) {

        }
    });
}

来源：https://stackoverflow.com/questions/63807517/jquery-ajax-call-passed-parameter-always-null-in-asp-net-mvc-core

标签

asp.net-core

jquery-ajax