Search code examples
kendo-uikendo-ui-angular2

Change dropdown popup height in Kendo for Angular

In this StackBliz I have a Kendo for Angular dropdown list. When you open the dropdown, the popup shows seven items. I just want to show three items. So I set the height in popupSettings to 30, but Kendo is ignoring it. How to change the popup height?

@Component({
  selector: 'my-app',
  template: `
      <kendo-dropdownlist 
         [data]="listItems"
         [popupSettings]="{
            width: 100,
            height: 30 }">
      </kendo-dropdownlist>
  `
})
export class AppComponent {
    public listItems: Array<string> = [];

    ngOnInit(){
         for(var i=1;i<=100;i++)
            this.listItems.push('Item ' + i);
    }

}
Solution

  • I found the answer here. You have to set the listHeight property.

    <kendo-dropdownlist 
    [data]="listItems"
    [popupSettings]="{
        width: 100,
        height: 30 }" 
    [listHeight]="500">
</kendo-dropdownlist>