JQuery DropDownList with checkboxes

Set the checkboxes property of the jqxDropDownButton. Author: http://jqwidgets.com Author: http://jqwidgets.com

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>
<div>
    <input style="margin-top: 20px;" type="button" id='jqxButton' value="Check some checkbox" />
</div>

JavaScript

var source = [
      "Affogato",
      "Americano",
      "Bicerin",
      "Breve",
      "Café Bombón",
      "Café au lait"];
  // Create a jqxDropDownList
  $("#jqxDropDownList").jqxDropDownList({
      source: source,
      selectedIndex: 5,
      theme: 'energyblue',
      checkboxes:true
});

$("#jqxDropDownList").on('checkChange', function (event)
{
    if (event.args) {
    var item = event.args.item;
    var value = item.value;
    var label = item.label;
    var checked = item.checked;
    var checkedItems = $("#jqxDropDownList").jqxDropDownList('getCheckedItems');
    alert(checkedItems);	
}
});
var itemsToCheck =[
			"Affogato",
      "Americano",
      "Bicerin",
      "Breve",
		];
 $('#jqxButton').on('click', function () {
 	itemsToCheck.forEach(function(v,k){
  	$("#jqxDropDownList").jqxDropDownList('checkItem',v);
  });
      
  });