How can I make a combobox open or close by clicking anywhere on the control.

[Marvin]

I would like my comboboxes to open or close the way a DropDownList works by clicking anywhere on the control, not just the arrow button.

 

I have tried handling the click event and calling .toggle(), but if I do this then clicking on the arrow button does not work.

[Martin Bechev]

Hi Marvin,

Using the toggle method is the right way to go when the ComboBox items need to be toggled programmatically. 

Instead of handling the generic click event, try using the focus event and see if the component is being opened already, by checking the isOpen field:

 <kendo-combobox #combo [data]="listItems" (focus)="onFocus(combo)">
 </kendo-combobox>

public onFocus(combo) {
    if (!combo.isOpen) {
      combo.toggle(true);
    }
  }

Regards,
Martin
Progress Telerik

[Marvin]

Thank you Martin.  Your solution works pretty good when clicking to initially focus the combo box.  It doesn't handle subsequent clicks like a DropDownList does however. 

So far the best code that is working for me is this, which tests the class names on the clicked target to see if the arrow was clicked.

<kendo-combobox #cb
   [data]="listItems"
   (click)="!$event.target.className.includes('k-select') && !$event.target.parentElement.className.includes('k-select') && cb.toggle()"
></kendo-combobox>