DHTMLX Docs & Samples Explorer

Configuring combo boxes on the fly

The comboboxes have different values for even and uneven rows (the Shipping column).

THIS PAGE CONTAINS SAMPLE FUNCTIONALITY OF PROFESSIONAL EDITION FOR DEMONSTRATION PURPOSE ONLY.
UNAUTHORIZED USE IS PROHIBITED. PLEASE CONTACT SALES@DHTMLX.COM TO OBTAIN A LEGAL COPY OF PROFESSIONAL EDITION.
Source
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxgrid.css">
<link rel="stylesheet" type="text/css" href="../../codebase/skins/dhtmlxgrid_dhx_skyblue.css">
<script  src="../../codebase/dhtmlxcommon.js"></script>
<script  src="../../codebase/dhtmlxgrid.js"></script>
<script  src="../../codebase/dhtmlxgridcell.js"></script>    
<style>
.even{
    background-color:#E6E6FA;
}
.uneven{
    background-color:#F0F8FF;
}
</style>
 
 
<div id="gridbox" style="width:600px;height:270px;background-color:white;"></div>            
<script>
function doOnEditCell(stage, id, index) {
    var ind = mygrid.getRowIndex(id);
    if ((index == 5) && (stage == 0))
    //start edit Shipping column;
    {
        var combo = mygrid.getCombo(5);
        if (ind % 2 == 1) {
            //for even rows;
            combo.save();
            //save initial state;
            combo.remove(1);
            combo.remove(2);
            combo.remove(3);
        } else {
            combo.save();
            //save initial state;
            combo.remove(4);
            combo.remove(5);
            combo.remove(6);
        }
    }
    if ((index == 5) && (stage == 2))
    //for finishing edit;
    mygrid.getCombo(5).restore();
    //restore combo state;
    return true;
}
mygrid = new dhtmlXGridObject('gridbox');
mygrid.setImagePath("../../codebase/imgs/");
mygrid.attachEvent("onEditCell", doOnEditCell);
mygrid.setSkin("dhx_skyblue");
mygrid.loadXML("../common/gridH.xml");
mygrid.enableAlterCss("even", "uneven");
</script>