select on dataItem after filter

[Bertha]

I have added filter in dropdownlist.  After user selects item from filter, when the program tried to select another item in dropdownlist, it will use the filtered list, not the original list.  How can I use the original full list to change selection?  Thanks.

 

var dropdownlist = $("#fac").data("kendoDropDownList");
dropdownlist.select(function (dataItem) {   <============================
return dataItem.FacCode === s + e.faccode;
});

[Dimitar]

Hello Bertha,

I am not sure that I can understand your requirements correctly. Can you elaborate a bit more on what exactly are you trying to achieve? It would also be of great help if you could provide an isolated example in the Dojo sandbox.

In general, modifying the widget's data source can be achieved through the DropDownList's setDataSource() method:

<input id="dropdownlist" />

<script>
  $("#dropdownlist").kendoDropDownList({
    dataSource: [ "Apples", "Oranges" ]
  });
  var dataSource = new kendo.data.DataSource({
    data: [ "Bananas", "Cherries" ]
  });

  var dropdownlist = $("#dropdownlist").data("kendoDropDownList");
  dropdownlist.setDataSource(dataSource);
</script>

Regards,
Dimitar
Progress Telerik

[Bertha]

I have added filter function to my dropdownlist and it worked correctly.

After user selects item using filter, I tried to use program to select other item in dropdownlist by checking the field in objects in dataItem of dropdownlist.  But after filter function, the dataItem only contains the filtered list, not the original list anymore.  So, I cannot programmatically change to select other item in dropdownlist not in filtered list.  Is there any other way to programmatically select non-filtered item in dropdownlist?

Current code I am using,

var dropdownlist = $("#fac").data("kendoDropDownList");
dropdownlist.select(function (dataItem) {   <============================
return dataItem.FacCode === s + e.faccode;
});

 

[Dimitar]

Hello Bertha,

To select another value in the DropDownList widget after a selection is made, I would suggest to use the change event of the widget to retrieve the DropDownList instance and then make a selection with the select() method as follows:

<script>
$(document).ready(function() {
  var ddl = $("#products").kendoDropDownList({
    dataTextField: "ProductName",
    dataValueField: "ProductID",
    dataSource: {
      transport: {
        read: {
          dataType: "jsonp",
          url: "https://demos.telerik.com/kendo-ui/service/Products",
        }
      }
    },
    change: function(e) {
      var ddl = e.sender,
            selectedProductId = ddl.dataItem().ProductID,
            desiredProductId = 70; // s + e.faccode

      ddl.value(70);
    }
  }).getKendoDropDownList();
});
<script>

The above is also demonstrated on the following Dojo example. In addition to this, I would suggest you to check out the Kendo Methods and Events Documentation, where additional resources on the same topic can be found.

Regards,
Dimitar
Progress Telerik