<link rel="stylesheet" type="text/css" href="../../codebase/skins/dhtmlxform_dhx_skyblue.css">
    <script src="../../codebase/dhtmlxcommon.js"></script>
    <script src="../../codebase/dhtmlxform.js"></script>
    <script>
var myForm,
formData;
function doOnLoad() {
    formData = [{
        type: "settings",
        position: "label-left",
        labelWidth: "auto",
        inputWidth: "auto"
    }, {
        type: "label",
        label: "Generate query"
    }, {
        type: "label",
        list: [{
            type: "select",
            label: "SELECT",
            options: [{
                value: "1",
                text: "*",
                selected: true
            }, {
                value: "2",
                text: "userId"
            }, {
                value: "3",
                text: "userName"
            }]
            }, {
            type: "newcolumn"
        }, {
            type: "select",
            label: "FROM",
            options: [{
                value: "1",
                text: "users",
                selected: true
            }]
            }, {
            type: "newcolumn"
        }, {
            type: "select",
            label: "WHERE",
            options: [{
                value: "1",
                text: "userId"
            }, {
                value: "2",
                text: "userName"
            }]
            }, {
            type: "newcolumn"
        }, {
            type: "select",
            label: " ",
            options: [{
                value: "1",
                text: "LIKE"
            }, {
                value: "2",
                text: "="
            }, {
                value: "3",
                text: ">"
            }, {
                value: "4",
                text: ">="
            }, {
                value: "5",
                text: "<"
            }, {
                value: "6",
                text: "<="
            }]
            }, {
            type: "newcolumn"
        }, {
            type: "input",
            label: " ",
            inputWidth: 50
        }, {
            type: "newcolumn"
        }, {
            type: "select",
            label: "ORDER BY",
            options: [{
                value: "1",
                text: "userId"
            }, {
                value: "2",
                text: "userName"
            }]
            }, {
            type: "newcolumn"
        }, {
            type: "select",
            label: " ",
            options: [{
                value: "1",
                text: "ASC"
            }, {
                value: "2",
                text: "DESC"
            }]
            }]
        }, {
        type: "label",
        list: [{
            type: "label",
            labelWidth: 250
        }, {
            type: "newcolumn"
        }, {
            type: "button",
            value: "Reset"
        }, {
            type: "newcolumn"
        }, {
            type: "button",
            value: "Submit"
        }]
        }];
    myForm = new dhtmlXForm("myForm", formData);
}</script>
 
 
    <div id="myForm" style="height:110px;"></div>