I'm trying to use the databound event with an MVC Kendo Grid, but DataBound is not in the list of options. I really need a javascript method to fire after the data is rendered to make use of it, and based research, I really can only do it with the databound event. I'm using version 2015.1.429.340 of the dll, which is the most recent I could find. I have Sync, Push, RequestEnd, many other events available. Just not DataBound.
My code looks like this:
@(Html.Kendo().Grid<type>()
.Name("name")
.Columns(columns =>
{
column stuff
})
.DataSource(dataSource => dataSource
.Ajax()
.Read(read => read.Action("method", "controller", new { id = "idstuff" }))
.Events(events => events.DataBound("method") )
)
.ToClientTemplate()
)
I hover over the red squiggly on DataBound and I see:
Kendo.Mvc.UI.Fluent.DataSourceEventBuilder does not contain a definition for DataBound and no extension method for DataBound accepting the first argument of type 'Kendo.Mvc.UI.Fluent.DataSourceEventBuilder' could be found.
Can someone please help me rectify this issue?
Thanks!
11 Answers, 1 is accepted
Hello Alex,
The reason for the issue is that the invoked method is the Events() method of the DataSource, so it will display the dataSource events. In order to attach handlers to Grid events you should invoke the Events() method of the Grid Fluent API.
@(Html.Kendo().Grid<type>() .Name("name") .Columns(columns => { column stuff }) .Events() .DataSource(dataSource => dataSource .Ajax()Dimiter Madjarov
Telerik
Rank 1
Thanks, that did allow me to use the databound method. However it did not act as I expected. The javascript (in this case a simple alert) fired off BEFORE the detail grid was rendered. I need to call a method AFTER the detail grid is rendered to reference checkboxes in that detail grid. Is there an event for that?
Thanks again.
Rank 1
Thanks, that did allow me to use the databound method. Unfortunately it did not act as I expected. It fired off the method (in this case as simple alert) BEFORE the detail grid was rendered. This grid is a detail grid for another parent grid. I need the event to fire AFTER the detail is rendered, is there an event for that?
Thanks again.
Rank 1
Hello Alex,
Indeed the dataBound event of the detail Grid is the correct place to reference the checkbox in the rendered table rows. Could you provide small isolated runnable example that I could inspect locally and assist further if needed?
I am looking forward to hearing from you.
Regards,Dimiter Madjarov
Telerik
Rank 1
Ok Dimiter, I have a great example project but it's over the 2mb limit. It's 15mb. Is there some way I can get that to you since I can't attach it here?
Rank 1
Dimiter, I've attached just the Controller and Views. You should be able to plug that into a starter kendo mvc project (that's the template I used when I set mine up, but I did have to add a kendo.mvc reference and a lib folder to hold it in). If I can send you the full solution by other means, let me know how.
If you run this, you'll see that if you set a breakpoint in the "Detail" action method, that the databound event, which fires off a method called test() which just has an alert, happens BEFORE the Detail action is even hit. So obviously it isn't happening after the data is rendered.
I need to interact with the checkbox that gets rendered after the detail grid is populated, but I didn't need to include that bit of code because the issue is evident just by observing the alert and the breakpoint.
Thanks so much for looking into this!
Hello Alex,
I would not recommend using the alert() method for debugging in this case. Regarding the problem, I was unable to observe it. For example the following code accesses the checkboxes and checks them in the dataBound event handler.
E.g.
function test() { this.tbody.find("input[type='checkbox']").prop("checked", true);}Dimiter Madjarov
Telerik
Rank 1
A few points to make here
1) Does that code actually run for you? There is no reference to 'this' that I can see there
2) Why is alert bad to use? The method being called could have anything in it.
3) To test that, I changed it so that instead of alerting, it updates a span html, and I can clearly see that it is updating it before the breakpoint in the detail action. So it is NOT waiting until the data is returned or rendered to call the javascript method.
Hello Alex,
I noticed the reason for the issue. Only the name of the event handler function should be passed as a parameter, no parenthesis is required.
E.g.
.Events(e => e.DataBound("test"))I assume that this is also the reason for the timing issue i.e. executing the function before the actual data binding. Regards,
Dimiter Madjarov
Telerik
Rank 1