save all rows in kendogrid to database on btnclick even

Question

Hi Team, Good Morning. I have a kendo Grid in a view with 2 rows and I have button to add additional rows to Grid. Till here I am good. Now my Grid is having 3 rows and there is save button at below. Now I want to save all the rows in database using MVC on save button click. Please help. Thanks, Sagar Pallavi

Sachin Singh · Answer

it's complicated but you can achieve it if you have a little knowledge of how Kendo Grid binds. The Grid bind with a datasource and dataItems of each row. so you can code as shown below. $( "#Save" ).click(function(){ var grid = $( "#grid" ).data( "kendoGrid" ); var arr=[]; $( 'grid tr' ).each(function () { var dataItem = grid.dataItem( this ); var obj={ col1:dataItem.Col1 // ex- Name: dataItem.Name col2:dataItem.col2 } arr.push(obj); }); var model = { Customers:arr }; $.ajax({ type: "post" , url: "/home/Save" , dataType: "json" , contentType: "application/json;charset=utf-8" , data: JSON.stringify(model), traditional: true , cache: false , success:function(){} }) step 2. Your model public class Grid { public List Customers {get;set;} } step 3. Your Save Action public void Save(Grid model) { _context.Customers.AddRange(model.customers); _context.SaveChanges(); } if you want to save only the modified rows then you can check the state property of dataItem, and select only the modified one.

Sachin Singh · Answer

Just replace the class Customer with your class.

Sagar Pallavi · Answer

Thanks Sachin for the response. How to pass row details to the controller as I am getting error at context.