// create ComboBox from input HTML element
$('input').kendoComboBox({
  dataTextField: "text",
  dataValueField: "value",
  dataSource: [
    { text: "Cotton", value: "1" },
    { text: "Polyester", value: "2" },
    { text: "Cotton/Polyester", value: "3" },
    { text: "Rib Knit", value: "4" }
  ],
  filter: "contains",
  suggest: true,
  index: 3
});

// create ComboBox from select HTML element
$('select').kendoComboBox();

// Cascading combobox
var $kUI_combobox_cascade_a = $('#kUI_combobox_cascade_a');
var $kUI_combobox_cascade_b = $('#kUI_combobox_cascade_b');
var $kUI_combobox_cascade_c = $('#kUI_combobox_cascade_c');

if($kUI_combobox_cascade_a.length && $kUI_combobox_cascade_b.length && $kUI_combobox_cascade_c.length) {
  $kUI_combobox_cascade_a.kendoComboBox({
    dataTextField: "name",
    dataValueField: "id",
    dataSource: [
      {name: "Parent1", id: 1},
      {name: "Parent2", id: 2}
    ]
  });
  $kUI_combobox_cascade_b.kendoComboBox({
    cascadeFrom: "kUI_combobox_cascade_a",
    cascadeFromField: "parentId",
    dataTextField: "name",
    dataValueField: "id",
    dataSource: [
      {name: "Child1_1", id: 1, parentId: 1},
      {name: "Child1_2", id: 1, parentId: 1},
      {name: "Child2_1", id: 2, parentId: 2},
      {name: "Child2_2", id: 2, parentId: 2}
    ]
  });
  $kUI_combobox_cascade_c.kendoComboBox({
    cascadeFrom: "kUI_combobox_cascade_b",
    cascadeFromField: "parentId",
    dataTextField: "name",
    dataValueField: "id",
    dataSource: [
      {name: "Child1_1_1", id: 1, parentId: 1},
      {name: "Child1_1_2", id: 3, parentId: 1},
      {name: "Child1_2_1", id: 3, parentId: 2},
      {name: "Child1_2_2", id: 4, parentId: 2},
      {name: "Child2_1_1", id: 5, parentId: 3},
      {name: "Child2_1_2", id: 6, parentId: 3},
      {name: "Child2_2_1", id: 7, parentId: 4},
      {name: "Child2_2_2", id: 8, parentId: 4}
    ]
  });
}