How to Start with Combo

dhtmlxCombo can be initialized in a plenty of ways. The simplest one is initialization from existing selectbox control. To achieve this you need to take the following steps:

Step 1. Include necessary files

Each DHTMLX component can be used standalone or as a part of the general library. If you use dhtmlxCombo standalone, you need to include 2 files:

dhtmlxcombo.js
dhtmlxcombo.css

<!DOCTYPE html>
<html>
    <head>
        <link rel="STYLESHEET" type="text/css" href="../codebase/dhtmlxcombo.css">
        <script src="../codebase/dhtmlxcombo.js"></script>  
   </head>
    <body>
    ...
    </body>
</html>

If you use dhtmlxCombo as a part of "dhtmlxSuite" package you need to include 2 files:

dhtmlx.js
dhtmlx.css

<link rel="STYLESHEET" type="text/css" href="../codebase/dhtmlx.css">
<script src="../codebase/dhtmlx.js" type="text/javascript"></script>

Including source files from CDN

To include JS/CSS files of "dhtmlxSuite" package from CDN, you should set direct links to dhtmlx.js and dhtmlx.css files:

<link rel="stylesheet" href="http://cdn.dhtmlx.com/edge/dhtmlx.css" 
    type="text/css"> 
<script src="http://cdn.dhtmlx.com/edge/dhtmlx.js" 
    type="text/javascript"></script>

By setting links in this way you will get the latest version of dhtmlxSuite. To get some particular version, just specify the number of the required version in the link, like this:

<link rel="stylesheet" href="http://cdn.dhtmlx.com/5.0/dhtmlx.css" 
    type="text/css"> 
<script src="http://cdn.dhtmlx.com/5.0/dhtmlx.js" 
    type="text/javascript"></script>

Step 2. Write native selectbox code

<select style='width:200px;'  id="combo_zone1" name="alfa1">
    <option value="1">a00</option>
    <option value="2">a01</option>
</select>

Step 3. Create Combo from select control

var myCombo = dhtmlXComboFromSelect("combo_zone1");

combo_zone1 - id of the select which needs to be converted

Alternative way of Combo initialization

Another approach is to create a new combobox inside of some HTML container:

Include necessary files

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

Write any container code (DIV is most common)

<div id="combo_zone2" style="width:200px; height:30px;"></div>

Create dhtmlxCombo in HTML container
```
var myCombo = new dhtmlXCombo("combo_zone2","alfa2",200);
```
- combo_zone2 - id of HTML container
- alfa2 - name used in form integration
- 200 - width of combobox
- use the 4th parameter in the constructor, if you need to add images into Combo ("image")