Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How can I refresh the grid after I edit the Kendo UI grid?

I edit the grid using editable: "popup" as shown on Telerik's demo page. After I edit the grid, I want the grid to refresh. Does the grid have any event that is called after I edit the grid?

I tried to use the databound event. In this event I make the datasource read, but it tells me it is an infinite loop to refresh the grid. I tried to use the saveChanges event, but it is not working.

@(Html.Kendo().Grid<Kendo.Mvc.Examples.Models.ProductViewModel>() .Name("grid") .Columns(columns => {     columns.Bound(p => p.ProductName);     columns.Bound(p => p.UnitPrice).Width(100);     columns.Bound(p => p.UnitsInStock).Width(100);     columns.Bound(p => p.Discontinued).Width(100);     columns.Command(command => { command.Edit(); command.Destroy(); }).Width(160); }) .ToolBar(toolbar => toolbar.Create()) .Editable(editable => editable.Mode(GridEditMode.PopUp)) .Pageable() .Sortable() .Scrollable()   .Events(events => events.Change("saveChanges ")) .HtmlAttributes(new { style = "height:430px;" }) .DataSource(dataSource => dataSource     .Ajax()     .PageSize(20)     .Events(events => events.Error("error_handler"))     .Model(model => model.Id(p => p.ProductID))     .Create(update => update.Action("EditingPopup_Create", "Grid"))     .Read(read => read.Action("EditingPopup_Read", "Grid"))     .Update(update => update.Action("EditingPopup_Update", "Grid"))     .Destroy(update => update.Action("EditingPopup_Destroy", "Grid")) )) 
like image 529
flower Avatar asked Feb 18 '14 19:02

flower


People also ask

How do I know if my Kendo grid is in edit mode?

find('. k-grid-edit-row'); When the grid is in edit mode, the editing row has a class of "k-grid-edit-row". This jquery statement will look for a row with the edit mode class within the table of id = "myGrid".

How do I refresh Kendo grid after Ajax call?

You should use the transport configuration for this, have a create url. After you insert a new item in the datasource, just call sync() and let the magic happen.


1 Answers

You can subscribe to the Sync event of the grid's data source and call the read method of its data source.

.Events(events => events.Error("error_handler").Sync("sync_handler"))  function sync_handler(e) {    this.read(); } 
like image 105
Atanas Korchev Avatar answered Sep 22 '22 09:09

Atanas Korchev