This is a migrated thread and some comments may be shown as answers.

Accessing data in listView from Kendo UI Touch events

3 Answers 169 Views
HTML5, CSS, JavaScript
This is a migrated thread and some comments may be shown as answers.
This question is locked. New answers and comments are not allowed.
Brian
Top achievements
Rank 2
Brian asked on 02 Feb 2016, 04:38 PM
I've been trying to find out how to access the data in a Kendo Mobile UI ListView when a Kendo UI Touch event triggers. Specifically, if the user sees a spelling mistake in an item on the screen, I want them to be able to touch-hold the line to bring up an input field to allow them to fix the spelling mistake. In order to identify the item they've touched, I've been trying to retrieve data from that line. The hold event  returns an object e, where e.touch is the touch event instance and e.event is the JQuery event which triggered the event. I can find documentation of the JQuery event, but I can't find a property which gives me access to the data in the line touched. I can't find any documentation for e.touch. I can make this work by expecting the user to touch the line first, thus triggering the click event of the listView and saving the data identifying the line delivered by the click event. If the user then holds the line, I retrieve the data stored by the click event and use that to identify the line, but that seems a kludge. Surely there should be some way to directly get the data from the hold event.

3 Answers, 1 is accepted

Sort by
0
Accepted
Tsvetina
Telerik team
answered on 05 Feb 2016, 02:45 PM
Hi Brian,

There isn't a direct way to get the item data but the task isn't too complex. You can first access the item uid from the HTML and then, get the data item from the ListView DataSource using this uid:
editRow: function (e) {
    var itemId = $(e.event.target).parents("li").attr("data-uid");
    var dataItem = $("#listview").data("kendoMobileListView").dataSource.getByUid(itemId);
 
    alert(dataItem.name);
}

Of course, if you have access to the DataSource instance, you can make it even simpler:
editRow: function (e) {
    var itemId = $(e.event.target).parents("li").attr("data-uid");
    var dataItem = ds.getByUid(itemId); // ds is the DataSource instance
 
    alert(dataItem.name);
}


Regards,
Tsvetina
Telerik
 

Visit the Telerik Verified Plugins Marketplace and get the custom Cordova plugin you need, already tweaked to work seamlessly with AppBuilder.

 
0
Brian
Top achievements
Rank 2
answered on 05 Feb 2016, 03:24 PM
Thanks, Tsvetina, that's great. I'll let you know how I get on
0
Brian
Top achievements
Rank 2
answered on 15 Feb 2016, 05:55 PM
Thanks, Tsvetina, that works a treat, much appreciated
Tags
HTML5, CSS, JavaScript
Asked by
Brian
Top achievements
Rank 2
Answers by
Tsvetina
Telerik team
Brian
Top achievements
Rank 2
Share this question
or