In this post we will take a look on how could we iterate all the data of Kendo UI Data Source? Let us say we have a JavaScript array as given below,
var speakers = [ { SpeakerName: "Chris Sells", SpeakerTitle: "Author, Ex- Microsoft and ardent community contributor" }, { SpeakerName: "Steve Smith", SpeakerTitle: "Speaker, Author, Microsoft Regional Director and MVP" }, { SpeakerName: "Dr.Michelle Smith", SpeakerTitle: "Enterprise Consultant" }, { SpeakerName: "Gaurav Mantri", SpeakerTitle: "Founder Cerebrata & Windows Azure MVP" } ];
We will create a Kendo Datasource reading speakers array. Very simply we can create data source as following,
var yourdatasource = new kendo.data.DataSource({ data: speakers });
Now we will see how we could iterate each data of data source. We can do that by calling data() function on Kendo UI Data source. data() function is used to get and set data of the Kendo data source.
So we can read data from data source as following. We are alerting length of data source below.
var datasourcedata = yourdatasource.data() alert(datasourcedata.length);
Finally we can iterate through data source as following,
yourdatasource.fetch(); var datasourcedata = yourdatasource.data() for (var i = 0; i < datasourcedata.length; i++) { var dataitem = datasourcedata[i].SpeakerName; alert(dataitem); }
As output in alert we will get entire speakername. In this way you can iterate through data of Kendo datasource. I hope you find this post useful. Thanks for reading.
What about a grid that has more than one page? data() gets only the items for the current page shown, How do you resolve it?
Cecilia ,
Any luck on this here ?. I am facing the same situation just like yours.
I need to iterate through next pages and I am not able to get the data.
Regards
Sunil
Hi Sunil … please send me an email with your scenario. here is my email – lohith.nagaraj@telerik.com. I will go thru your problem and respond to you.
Hi Sunil/Cecilia
The data() method should be used when no filter or paging or sorting has been applied. data holds the pristine data in it. But when you set a pageSize – you will need to use view() method to get the current page date. To advance to a new page you should use the page() method and let the data source know which page you want to navigate. here is the documentation on the same: http://docs.telerik.com/kendo-ui/api/javascript/data/datasource#methods-page
Hope this helps.
regards
Lohith
Hi, I am developing an ASP.NET MVC application and I have method of type List in one of my Model classes. This method returns an array of all elements that I want to be displayed in a Telerik Grid. Is it possible to bind array data in a Telerik Grid? If yes, then how?
My Controller returns the list in itself. I want the elements in the list to be displayed on a Kendo Grid. How can I do this? Thanks.
Pingback: Top 5 Blog Posts of 2014 | telerik helper
this doesn’t seem to work if the grid column uses an editor template. in such cases, inputted changes are not shown in the model you iterate over.
Just a warning, your suggestion does not work with a kendo Hierarchical datasource – which is fairly common eg kendo tree. It’s because a hierarchical datasource contains arrays of arrays and so you need recursive traversal. But your title really suggests it would do this, so may I suggest changing it to realize this important limitation, that it doesn’t cover all common cases.