There are following default properties of the combo list:

• width is equal to the width of combo container;
• height is 100px;
• bottom position.

These properties can be changed using combo API.

All methods, that are described below, are defined in the dhtmlxcombo_whp.js:

  <link rel="STYLESHEET" type="text/css" href="../codebase/dhtmlxcombo.css">
  <script src="../codebase/dhtmlxcommon.js"></script>
  <script src="../codebase/dhtmlxcombo.js"></script>
  <script src="../codebase/ext/dhtmlxcombo_whp.js"></script>

Custom List Size

Combo allows to set certain width and height for option list. You can use setOptionWidth(width) and setOptionHeight(height) methods to change the size of the list:

  combo.setOptionWidth(300);
  combo.setOptionHeight(200);

Moreover both width and height can be automatically set by enableOptionAutoWidth and enableOptionAutoHeight methods. In this case combo options will be shown in the list without horizontal and vertical scrolls.

  combo.enableOptionAutoWidth(true);
  combo.enableOptionAutoHeight(true);

List Position

The enableOptionAutoPositioning method enables automatic list positioning: top or bottom - depending on page layout:

  combo.enableOptionAutoPositioning();