Kendo UI Grid post rendered or post databound event?

Question

Is there a way to trigger an event after grid has been reloaded via ajax?

i see the RequestEnd event. but that seems to happen when the request returned, but before the grid has been refreshed.

i also see DataBound event. but that happens even earlier than RequestEnd,
also when i implement DataBound event, my header disappears..

i had to resort to this hack

function requestEnd(o) {     console.debug('request ended.', o);     setTimeout(refreshEditable, 500); // enough time to render the grid } function refreshEditable() {     // perform my actions on controls within grid content } 

as a side note.. I am having a very hard time finding a reliable kendo grid mvc API reference. when i google for it, i get this: http://docs.telerik.com/kendo-ui/getting-started/using-kendo-with/aspnet-mvc/migration/widgets/grid which is a collection of little how-to and some "Events" but those don't correspond to what I am seeing in razor intelisense.

update: adding databound definition

    $('#grid').kendoGrid({         dataBound: function(e) {             console.debug('data bound..');         }     }); 

and here's grid ajax definition

   .Ajax().Read(read => read         .Action("FilesRead", "SomeController")         .Data("readData"))   function readData() {     return {         IncludeChildren: $("#IncludeChildren").is(':checked'),         SearchString: $('input[id=SearchString]').val()     };  } 

i can see that DataBound is triggered while making the ajax call, not after it comes back.

update

corrected the DataBound event hook.

in dataBound function, i'm trying to get a reference to newly rendered templates..

function dataBound(o) {   console.debug($('span.editable').length);                    // returns 0    setTimeout("console.debug($('span.editable').length)", 500); // returns 4 } 

the spans are added using a client template

.ClientTemplate(@"<span class=""editable"" ... >#=DOCUMENT_DATE_FORMATTED#</span>"); 

see what i mean? data bound happens before grid is rendered

Answer 1

See this sample code taken from the documentation (API docs on events are here) on how to bind an event handler using MVC wrappers:

@(Html.Kendo().Grid(Model)       .Name("grid")       .Events(e => e           .DataBound("grid_dataBound")           .Change("grid_change")       ) ) <script> function grid_dataBound() {     //Handle the dataBound event }  function grid_change() {     //Handle the change event } </script> 

If you want to bind a handler in JavaScript, you need to access the grid like this:

var grid = $("#grid").data("kendoGrid"); grid.bind("dataBound", function(e) {}); 

When you do this here:

$('#grid').kendoGrid({     dataBound: function(e) {         console.debug('data bound..');     } }); 

you actually create a new grid instance.