Utsab
Utsab

Reputation: 23

Kendo UI autocomplete retrieve id on select

Here is my code:

 $(document).ready(function() {
                    var autocomplete = $("#customers").kendoAutoComplete({
                        minLength: 1,
                        dataTextField: "VenueName", change:onChange,

                        select: onSelect,
                        template: '<img src=\"${data.Thumbnail}" alt=\"${data.VenueName}\" />' +
                                  '<h4>${ data.VenueName }</h4>' +
                                  '<p>${ data.VenueAddress }</p>',
                        dataSource: {
                            transport: {
                                read:{
                                    dataType: "jsonp",
                                    url: "load.php?dbsources=listvenues"
                                }
                            }
                        },
                        height: 370,
                    }).data("kendoAutoComplete");


                });

And the data source will look like this:

([{"VenueID":"84","ID":"10421","VenueName":"Utivs Venue","VenueAddress":"72/74 Meehan Street" ,"Thumbnail":"10421-logo-sd-175x195-img.png"},{"VenueID":"85","ID":"10429","VenueName":"Richards place","VenueAddress":"2 Cross Street" ,"Thumbnail":"10429-logo-sd-175x195-img.png"},{"VenueID":"86","ID":"10437","VenueName":"Lyndzs House of Mandominion","VenueAddress":"80 Chesterfield Parade" ,"Thumbnail":"10437-logo-sd-175x195-img.png"} ])

How do I get VenueID and ID from datasource for further operation on select. I want to save VenueID and ID in a hidden field when a value is selected from autocomplete.

Many Thanks in advance.

Upvotes: 1

Views: 8671

Answers (2)

charino
charino

Reputation: 594

Having a simple dataSource:

dataSource: [ 
          { id: 1, Name: "Apples" }, 
          { id: 2, Name: "Oranges" }, 
          { id: 3, Name: "Carrots" } ];

Getting the current item in select callback:

   select: function(e) {
      var dataItem = this.dataItem(e.item.index());
      alert(dataItem.id);
      // logic after that 
    }

You can check full example from the url: http://jsbin.com/nanuvihune/1/edit

Upvotes: 0

user1856096
user1856096

Reputation: 81

select: function (ev) {

                var dataItem = this.dataItem(ev.item.index());
                alert(dataItem.VenueID);
                alert(dataItem.ID);
            }

Upvotes: 5

Related Questions