JavaScript DropDownList Control

Set the filterable property of jQWidgets DropDownList

by musicreader

HTML

<link rel="stylesheet" href="http://jqwidgets.com/public/jqwidgets/styles/jqx.base.css">
<link rel="stylesheet" href="http://jqwidgets.com/public/jqwidgets/styles/jqx.energyblue.css">
<script src="http://jqwidgets.com/public/jqwidgets/jqx-all.js"></script>
<div id='jqxDropDownList'></div>

JavaScript

var source = [
      "Affogato",
      "Americano",
      "Bicerin",
      "Breve",
      "Café Bombón",
      "Café au lait"];
  // Create a jqxDropDownList
  $("#jqxDropDownList").jqxDropDownList({
      source: source,
      selectedIndex: 3,
      theme: 'energyblue',
      filterable: true,
      dropDownHeight: 130
  });
  
  $('#jqxDropDownList').on('select', function (event)
{
    var args = event.args;
    if (args) {
    // index represents the item's index.                
    var index = args.index;
    var item = args.item;
    // get item's label and value.
    var label = item.label;
    var value = item.value;
    var type = args.type; // keyboard, mouse or null depending on how the item was selected.
    alert(value+"-"+index);
}                        
});