DHTMLX Docs & Samples Explorer

Form and Window

Source
<link rel="stylesheet" type="text/css" href="../../codebase/skins/dhtmlxform_dhx_skyblue.css">
    <link rel="stylesheet" type="text/css" href="../../../dhtmlxWindows/codebase/dhtmlxwindows.css">
    <link rel="stylesheet" type="text/css" href="../../../dhtmlxWindows/codebase/skins/dhtmlxwindows_dhx_skyblue.css">
    <script src="../../codebase/dhtmlxcommon.js"></script>
    <script src="../../../dhtmlxWindows/codebase/dhtmlxcontainer.js"></script>
    <script src="../../../dhtmlxWindows/codebase/dhtmlxwindows.js"></script>
    <script src="../../codebase/dhtmlxform.js"></script>
    <style>
        div#vp {
            height: 600px;
            border: 1px solid #cecece;
        }
    </style>
    <script>
var myForm,
formData;
var dhxWins,
w1;
function doOnLoad() {
    formData = [{
        type: "settings",
        position: "label-left",
        labelWidth: 100,
        inputWidth: 120
    }, {
        type: "radio",
        name: "type",
        label: "Already have account",
        labelWidth: "auto",
        position: "label-right",
        checked: true,
        list: [{
            type: "input",
            label: "Login",
            value: "p_rossi"
        }, {
            type: "password",
            label: "Password",
            value: "123"
        }, {
            type: "checkbox",
            label: "Remember me",
            checked: true
        }]
        }, {
        type: "radio",
        name: "type",
        label: "Not registered yet",
        labelWidth: "auto",
        position: "label-right",
        list: [{
            type: "input",
            label: "Full Name",
            value: "Patricia D. Rossi"
        }, {
            type: "input",
            label: "E-mail Address",
            value: "p_rossi@example.com"
        }, {
            type: "input",
            label: "Login",
            value: "p_rossi"
        }, {
            type: "password",
            label: "Password",
            value: "123"
        }, {
            type: "password",
            label: "Confirm Password",
            value: "123"
        }, {
            type: "checkbox",
            label: "Subscribe on news"
        }]
        }, {
        type: "radio",
        name: "type",
        label: "Guest login",
        labelWidth: "auto",
        position: "label-right",
        list: [{
            type: "select",
            label: "Account type",
            options: [{
                text: "Admin",
                value: "admin"
            }, {
                text: "Organiser",
                value: "org"
            }, {
                text: "Power User",
                value: "poweruser"
            }, {
                text: "User",
                value: "user"
            }]
            }, {
            type: "checkbox",
            label: "Show logs window"
        }]
        }, {
        type: "button",
        value: "Proceed"
    }];
    dhxWins = new dhtmlXWindows();
    dhxWins.setImagePath("../../../dhtmlxWindows/codebase/imgs/");
    dhxWins.enableAutoViewport(false);
    dhxWins.attachViewportTo("vp");
    w1 = dhxWins.createWindow("w1", 10, 10, 350, 430);
    myForm = w1.attachForm(formData);
 
}
</script> <div id="vp"></div>