Combobox dropdown template

[Andrew]

I have two questions about styling the Combobox dropdown panel.

First, how would I style the panel with the dropdown values be wider than the text input box?

Second, how can I style the dropdown values to be a table with column headers?

Here's a simple example image I found that illustrates what I'm talking about:

http://i.imgur.com/Uu8Dk2t.png

[Dimiter Madjarov]

Hi Andrew,


You could specify a custom width for the ComboBox via it's list object. Take a look at the following JS Bin example, which demonstrates this.

Regarding your second question, styling the list as a table is not supported out of the box, but you could simulate it by specifying a custom template for the items and binding to the open event to prepend the header. 
E.g.

function onOpen(e){
    var header = "Custom header";
    this.list.find("ul").prepend(header);
}

 

All the best,
Dimiter Madjarov
the Telerik team