why list of id not sent by jQuery to razor page although it display on

ahmed salah

I work on asp.net razor page . i face issue when sent list of id from jQuery ajax to razor

page it display on razor page as count 0 although it display on console of browser two items

on array

public JsonResult OnGetListIdUpdated(List selectedIds)
{
   return new JsonResult(selectedIds);
}


$(document).ready(function () {

            $('#reprintdatabtn').click(function (event) {
                event.preventDefault();
                  var selectedIds = [];
    $("input[name='chkSel']:checked").each(function() {
                    var id = $(this).closest("tr").find("td:last").text();
      if (id !== "") {
        selectedIds.push(parseInt(id));
      }
                }); 
                console.log(selectedIds);
                $.ajax({
                    url: '?handler=ListIdUpdated',
                    type: "GET",
                    dataType: "json",
                    data: { selectedIds: selectedIds },


                    success: function (response) {
                        $("#lblRowsCount").html(response.counter);
                        $('#msgstatus').text(response.messageStatus);
                        // Handle the server response here
                    }
                });
            });
});

so on browser console.log(selectedIds); i get data correctly as below

and when debug this line below on razor it display null

public JsonResult OnGetListIdUpdated(List selectedIds)

so why this issue happen please

5 Replies

Know the answer? Post it — somebody with the same question will find it here.

Amit Mohanty3y ago

Try this

$.ajax({
    url: '?handler=ListIdUpdated',
    type: "POST",
    dataType: "json",
    data: { selectedIds: selectedIds },
    success: function (response) {
        // Handle the server response here
    }
});

public JsonResult OnPostListIdUpdated([FromBody] List selectedIds)
{
    return new JsonResult(selectedIds);
}

Vishal Joshi3y ago

Hello Ahmed,

It's because of the list of arrays. you need to stringify an array object. Please try the below code to get it to work.

$.ajax({
  url: '?handler=ListIdUpdated',
  type: "GET",
  dataType: "json",
  data: JSON.stringify({ selectedIds: selectedIds }), // Json stringify here
  success: function (response) {
    $("#lblRowsCount").html(response.counter);
    $('#msgstatus').text(response.messageStatus);
    // Handle the server response here
  }
});

Thanks

Deepak Rawat3y ago
The issue you're facing might be related to how you're passing the data from the JavaScript/jQuery code to the Razor page. Here are a few things you can check to troubleshoot the problem:
1. Make sure the OnGetListIdUpdated method in your Razor page is decorated with the [HttpGet] attribute. This is necessary to indicate that the method should handle HTTP GET requests.
2. Verify that the selectedIds parameter in the OnGetListIdUpdated method has the same name as the parameter in your JavaScript code (selectedIds). Case sensitivity matters in this case.
3. Ensure that the Razor page's URL is correct in the url property of your AJAX request. It seems that you're using a Razor page handler (?handler=ListIdUpdated), so make sure the handler name matches the one defined in your Razor page.
4. Check if you have any model binding conflicts. If you have a conflicting route or another action method that accepts a GET request with the same parameter name (selectedIds), it can cause issues. In that case, you may need to use a different parameter name or consider changing the HTTP verb (e.g., to POST).
5. Double-check that the List parameter in your OnGetListIdUpdated method is not decorated with any custom model binders or validation attributes that might interfere with the binding process.
By verifying these points, you should be able to identify and resolve the issue with passing the list of IDs from jQuery AJAX to your Razor page.
0
ahmed salah3y ago
can you help me please by provide full solutions as razor and jquery ajax because i change it to post and not worked
0
Prasad Raveendran3y ago
Request Format: By default, jQuery's $.ajax method sends the data as query parameters in the URL for GET requests. However, in Razor Pages, parameters are typically expected in the request body for non-GET requests. To resolve this, you can change the type in your AJAX request to "POST" instead of "GET".
```
$.ajax({
    url: '?handler=ListIdUpdated',
    type: "POST",  // Change the type to POST
    dataType: "json",
    data: { selectedIds: selectedIds },
    success: function (response) {
        // Handle the response
    }
});
```
Then, update the OnGetListIdUpdated method to use the [HttpPost] attribute to handle the POST request.
0