This is a migrated thread and some comments may be shown as answers.

Reading the Selected Row data in grid to the Controller using ajax call

4 Answers 332 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Jeremy
Top achievements
Rank 1
Jeremy asked on 09 Oct 2013, 06:07 AM
Hi,

I have a grid structured with few columns and a column with checkbox using client template method.
Now i want to read the row values that are selected on an button action click and that has to be passed to the controller for processing the data. 

I have mentioned my grid structure below
 @(Html.Kendo().Grid<MyMVC.Models.MyModel>()
    .Name("MyGrid")
    .Columns(columns =>
    {
        columns.Bound("").Width(25).ClientTemplate("<input type='checkbox' checked='checked' id='rowcheck'  ></input>"); -- CheckBox in grid
        columns.Bound(p => p.LeaveDate)
        columns.Bound(p => p.start);
        columns.Bound(p => p.end);
        columns.Bound(p => p.reason).Width(400);
    })

     .DataSource(dataSource => dataSource
        .Ajax()
        .Read(read => read.Action("GetLeaveGridData", "StaffManagment"))
        .ServerOperation(false)

    )
  .Selectable(s => s.Mode(GridSelectionMode.Multiple))  
  .HtmlAttributes(new { @style = "font-family:calibri; font-size:12px" })
   .Scrollable()
)

I have done the coding for selecting the key column leave date using the jquery, but i want remining column data to be passed to the controller. 
Can anyone help me out how to achieve this. Is this possible or we have to go with some other methodology. 

Note : The selected row mentions the row which are checked by the user in the checkbox column.

Thanks
M.Mayilsamy
On Behalf of Jeremy

4 Answers, 1 is accepted

Sort by
0
Alexander Popov
Telerik team
answered on 10 Oct 2013, 09:10 AM
Hello Jeremy,

I am not sure I understand you correctly, but in case you want to use checkboxes for selecting Grid rows I would recommend you this example project from our Code Library. After the user selected one or more rows (using the checkboxes) and clicks the "Process" (for example) button you could use the following approach to get the selected rows and pass them to the controller:  
function () {
     var grid = $("#grid").data("kendoGrid");
     var checked = [];
     var dataItems = [];
     for(var i in checkedIds){
         if(checkedIds[i]){
             checked.push(i);
             dataItems.push(grid.dataItem("tr:eq("+ i +")"));
         }
     }
     //use ajax request to send the data of the selected items
     $.ajax({
          type: "POST",
          url: "Some/Controller",
          data: dataItems
      })
      .done(function (data) {
          //do something with the response if necessary 
      });
 });

If the above example does not answer your question or I misunderstood, please provide additional information so we can advice you further.

Regards,
Alexander Popov
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Prashant
Top achievements
Rank 1
answered on 14 Jul 2015, 07:31 PM

Hi Alex,

I tried the same way as you suggested and I get a telerik script error when I post the data.

 0x800a138f - JavaScript runtime error: Unable to get property 'field' of undefined or null reference

 and this happens at the following line of code  'e' is returned as undefined: 

i.trigger(yt,{field:e.field,node:e.node,index:e.index,items:e.items||[this],action:e.node?e.action||"itemloaded":"itemchange"})})),e},

 FYI , I use  Kendo UI v2015.1.429 version.

Any help is appreciated.

0
Dimiter Madjarov
Telerik team
answered on 16 Jul 2015, 02:07 PM

Hello Prashant,

We cannot state for sure what is causing the problem, without inspecting the sample code. Please send us small isolated runnable example in which the issue is reproduced, so we could assist further.

Regards,
Dimiter Madjarov
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Prashant
Top achievements
Rank 1
answered on 21 Jul 2015, 05:59 PM
Hi Dimiter,

The name was just a sample one.

However, I was able to solve the issue by using the telerik's internal function $('#GridName').data("kendoGrid").dataSource().sync();

Thank You.

Regards,
Prashant.
Tags
Grid
Asked by
Jeremy
Top achievements
Rank 1
Answers by
Alexander Popov
Telerik team
Prashant
Top achievements
Rank 1
Dimiter Madjarov
Telerik team
Share this question
or