Find and select item but not the DataValueField

[Robert Madrian]

Hello,

I have a Dropdownlist and want find and select item from the list but the search value is not the DataValueField but another field in the dataitems Collection...

How to do this in the Right way?

robert

[Ivan Danchev]

Hello Robert,

By default the DropDownList is filtered by the field that is set as DataTextField. See the following KB article, which demonstrates how the DropDownList can be filtered by multiple fields. In your scenario if you don't want to filter by multiple fields, but by the field that is set as DataValueField you can modify the filtering event handler like this:

filtering: function(ev){
  var filterValue = ev.filter != undefined ? ev.filter.value : "";
  ev.preventDefault();

  this.dataSource.filter({
    filters: [
      {
        field: "CustomerID",
        operator: "contains",
        value: filterValue
      }
    ]
  });
}

In the linked example the "CustomerID" field is set as DataValueField, so you will have to replace it with the respective field that is present in your data.

Regards,
Ivan Danchev
Progress Telerik

[Robert Madrian]

Hello Ivan,

I don't want to filter the DropDownList but I want to seach for a specific value in the dataitems and select that item!

robert

[Ivan Danchev]

Hello Robert,

In that case if the scenario does not involve filtering the DropDownList, but selecting programmatically an item that has a specific field value, you can use the API of the DropDownList and its DataSource to achieve that. Here's another example. In the dataBound event handler (the event fires when the data is loaded in the DropDownList) we loop over the dataItems in the DataSource, when we find one that has the respective field value (in the example that is origin: "Germany") we call the DropDownList's value method and pass the dataItem's id value, in order to select the respective item. In the example the function that contains the logic for selecting an item is called in the widget's dataBound event handler, but you can call it elsewhere, for example in a button click handler. You just need to pass the proper reference to the widget and the filed value that you will be searching for.

Regards,
Ivan Danchev
Progress Telerik

[Robert Madrian]

Thanks for the sample - I have made it a little bit more generic:

 

selectItemByFieldValue: function (dropdownlistName, field, value, id) {
     try {
         var dropdownlist = (typeof (dropdownlistName) === "object") ? dropdownlistName : $(dropdownlistName).data("kendoDropDownList");;
         var data = dropdownlist.dataSource.data();
         var dataItem = "";

         for (var i = 0; i < data.length; i++) {
             if (data[i][field] === value) {
                 dataItem = data[i];
             }
         }
         return dropdownlist.value(dataItem[id]);
     } catch (e) {
         console.error("ERROR: jsGpdb.kendoDropDownList.searchRowLimit, ", dropdownlistName);
     }
     return null;
 }