Unable to push large amount of data to the controller using json

Question

I have a webgrid with lots of rows and each row has a checkbox. If I select 10 rows I am able to push the data to my method in the controller and update the database. Once the rows selected are more than 20, Nothing happens. I cant step into my method. Is there a limitation I can pass with json? What do you think is wrong?

Here is my jquery code

           $('#MultipleAcctAssignSubmit').click(function () {

                    var routeselected = $('#ddlroutes :selected').val();
                    var repsselected = $('#ddlreps :selected').val();

                    var routeselectedText = $('#ddlroutes :selected').text();
                    var repsselectedText = $('#ddlreps :selected').text();            

                    var branchcode = $("#ddlDropDownList option:selected").text();
                    var values = [];
                    $("#container-grid input[name=CatalogOrderId]:checked").each(function () {
                        row = $(this).closest("tr");

                        if (routeselected == "") {
                            //routeselected = $(row).find("td div.RouteId").text();
                            //routeselected = $(".routeId").val();
                            routeselected = 0;                   
                        }

                        if (repsselected == "") {
                            //repsselected = $(row).find("td div.primrep").text();
                            //repsselected = $(".PrimaryRepId").val();
                            repsselected = 0;
                        }

                        values.push({
                            CatalogOrderId: $(row).find("input[name=CatalogOrderId]").val(),
                            RouteId: routeselected,
                            Primaryrep: repsselected,
                            Isvalidated: "Assigned"
                        });
                    });
                    console.log(values);

                    if (values.length < 1) {
                        ShowDialogBox('Selection of rows', 'No records have been selected. Please select the record(s) you wish to assign.', 'Ok', '', 'GoToAssetList', null);
                        return;
                    }

                    /* Do some stuff with the values collected */            
                    var things = JSON.stringify({ 'CatalogSelectedOrders': values });

                    $.get('@Url.Action("SubmitCatalogOrders", "Home")', { 'values': things, 'strBranchcode': branchcode }, function(result) {
                        $('#scrolltable').html(result);
                    });

                });

Here is my method in the controller

                public ActionResult SubmitCatalogOrders(string values, string strBranchcode)
                {
                    Grabpartialviewdata objcatsubmit = new Grabpartialviewdata();
                    string stripOutBranchName = string.Empty;
                    stripOutBranchName = strBranchcode.Substring(0, 3);
                    string status = string.Empty;
                    List<Catalogorder> cleanedData = null;

                    try
                    {
                        var stripOffObjectName = JObject.Parse(values)["CatalogSelectedOrders"];
                        cleanedData = JsonConvert.DeserializeObject<List<Catalogorder>>(stripOffObjectName.ToString());
                        status = _edmDataService.ProcessWriteAssingedRowsToDb(cleanedData, stripOutBranchName);
                        ViewData["SelectList"] = HttpContext.Session["SelectList"] ?? new List<Int64>();

                        if (status == "success")
                        {
                            objcatsubmit = _edmDataService.GetPartialViewData(stripOutBranchName);
                        }

                    }
                    catch (Exception ex)
                    {
                        logger.Error(ex);
                    }

                    return PartialView("_Edmcatorderdetails", objcatsubmit);

                }

Answer 1

Your code is making a GET call using the $.get method. GET call send data via query string and has a limitation.

You should consider using a POST call which sends data in the request body. You can use the jquery $.post method for that.

var url="@Url.Action("SubmitCatalogOrders", "Home")";
$.post(url, { 'values': things, 'strBranchcode': branchcode }, function(result) {
       $('#scrolltable').html(result);
});

Also i see you are sending everything as a single string value. You don't need to do that. You can send a javascript object and use your view model as the paramter and the default model binder will be able to map your posted object(s) to your view model object properties.