Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
380
igGrid selectedrows post to controller
posted

I'm just getting started with the igGrid and MVC in general, and I am currently stuck trying to get the selected rows back to my controller.  In my application the user will be presented with a number of rows in the grid, and they must select on ones they want to process.  I got the grid setup with the data and the selection boxes, I have an actionlink that gets the selected rows and calls the controller.  The problem is that the array that is posted has the right number of items, but they are all null.  What am I doing wrong?

        $(function () {
            $('#process').click(function () {
                var rows = $('#Testing_Grid_Due').igGridSelection('selectedRows');
 
                $.ajax({
                    url: '/Test/Process',
                    type: 'POST',
                    data: JSON.stringify(rows),
                    contentType: 'application/json; charset=utf-8',
                    success: function (data) {
                        if (data.success)
                            alert(data.success);
                        else
                            alert("Add Failed: " + data.reason);
                    },
                    error: function () {
                        alert("Unknown Error");
                    }
                });
            });
        });

        [HttpPost]
        public ActionResult Process(List<TestRecord> selected)
        {
            return Json(new { success = false, reason = "not implemented" });
        }
  • 49378
    Verified Answer
    posted

    Hi dhorth,

    Thank you for posting in the community.

    In this scenario the returned selected row objects would not be the ones needed in order to post the selected row data.

    The primary key id of each selected row would be returned through one of the selected row's elements, for instance:

          

    var selectedRows = $("#EmpGrid").igGridSelection("selectedRows");

    var rowId = selectedRows[0].element.data().id

    Using the row's id, the data record can then be accessed using the grid'sfindRecordByKeymethod:

    $("#EmpGrid").igGrid("findRecordByKey", selectedRows[0].element.data().id)

    This returns a json object containing the data record's values. Using this approach a row data object array may be built and then posted, for example:

    Code Snippet
    1.     <script>
    2.  
    3.         function sendRowsToServer() {
    4.             var selectedRows = $("#EmpGrid").igGridSelection("selectedRows");
    5.  
    6.             var rowDataObjects = new Array();
    7.             for (i = 0; i < selectedRows.length; i++) {
    8.                 rowDataObjects[i] = $("#EmpGrid").igGrid("findRecordByKey", selectedRows[i].element.data().id);
    9.             }
    10.  
    11.             $.ajax({
    12.                 url: 'Home/Process',
    13.                 type: "POST",
    14.                 data: JSON.stringify(rowDataObjects),
    15.                 contentType: 'application/json; charset=utf-8',
    16.                 success: function (data) {
    17.                     if (data.success)
    18.                         alert('ok');
    19.                 }
    20.             });
    21.         }
    22.  
    23. </script>

    Attached is also a sample project illustrating this scenario.

    Please let me know if this helps.

    igGridMVC4 (4).zip