DHTMLX Docs & Samples Explorer

### Using API

Manipulate list content and appearance using Combo API methods

set text set new label for second option clearAll reload delete selected option get current combo text get selected text get selected value |

Source

    <script>window.dhx_globalImgPath = "../../codebase/imgs/";</script>
    <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxcombo.css">
    <script  src="../../codebase/dhtmlxcommon.js"></script>
    <script  src="../../codebase/dhtmlxcombo.js"></script>

    <div id="combo_zone" style="width:200px; height:30px;"></div>
    <table width="100%"><tr><td valign="top">
    <a href="javascript:void(0)" onclick="z.setComboText(document.getElementById('ctxt').value)">set text</a> <input type="text" id="ctxt" size="10" value="combo"><br>
    <a href="javascript:void(0)" onclick="z.updateOption(2,2,document.getElementById('labtxt').value,'')">set new label for second option</a><input type="text" id="labtxt" size="10" value="New label"><br>
    <a href="javascript:z.clearAll();z.openSelect();">clearAll</a><br>
    <a href="javascript:z.clearAll();z.addOption([[1,1111],[2,2222],[3,3333],[4,4444],[5,5555]]);z.openSelect();">reload</a><br>
    <a href="javascript:z.deleteOption(z.getSelectedValue());">delete selected option</a><br>
    <a href="javascript:void(0)" onclick="document.getElementById('info').innerHTML+='Curren text '+z.getComboText()+'<br></a>'">get current combo text</a><br>
    <a href="javascript:void(0)" onclick="document.getElementById('info').innerHTML+='Selected text '+z.getSelectedText()+'<br>'">get selected text</a><br>
    <a href="javascript:void(0)" onclick="document.getElementById('info').innerHTML+='Option ' +z.getSelectedText()+' with value '+z.getSelectedValue()+'  is selected<br>'">get selected value</a><br>
    </td><td width="50%"><div id="info" width="100%" height="200"></div></td></tr></table>
    <script>var z = new dhtmlXCombo("combo_zone", "alfa", 200);
    z.addOption([[1, 1111], [2, 2222], [3, 3333], [4, 4444], [5, 5555]]);</script>