<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>
    <style>
        div#simpleLog, div#simpleLog2 {
            font-family: Tahoma;
            font-size: 11px;
            margin: 20px 20px 0px 0px;
        }
    </style>
    <script>
var myForm,
formData,
logObj;
var myForm2,
logObj2;
function doOnLoad() {
 
    // init from json
    formData = [{
        type: "settings",
        position: "label-left",
        labelWidth: 130,
        inputWidth: 120
    }, {
        type: "fieldset",
        label: "Init from JSON",
        inputWidth: "auto",
        list: [{
            type: "radio",
            name: "type",
            label: "Already have account",
            labelWidth: "auto",
            value: "have_account",
            position: "label-right",
            checked: true,
            list: [{
                type: "input",
                label: "Login",
                value: "p_rossi",
                name: "login",
                userdata: {
                    max_lentgh: 15,
                    char_allowed: "a-zA-Z0-9_-"
                }
            }, {
                type: "password",
                label: "Password",
                value: "123"
            }, {
                type: "checkbox",
                label: "Remember me",
                checked: true
            }],
            userdata: {
                check_session: true,
                exp_days: 10
            }
        }, {
            type: "radio",
            name: "type",
            label: "Not registered yet",
            labelWidth: "auto",
            position: "label-right",
            list: [{
                type: "input",
                label: "Login",
                value: "p_rossi"
            }, {
                type: "password",
                label: "Password",
                value: "123"
            }, {
                type: "password",
                label: "Confirm Password",
                value: "123"
            }, {
                type: "input",
                label: "E-mail Address",
                value: "p_rossi@example.com"
            }]
            }, {
            type: "button",
            value: "Proceed",
            name: "proceed",
            userdata: {
                skip_validation: true
            }
        }]
        }];
    myForm = new dhtmlXForm("myForm", formData);
    checkUserData(myForm, log);
 
    // init from xml
    myForm2 = new dhtmlXForm("myForm2");
    myForm2.loadStruct("../common/dhxform_userdata.xml?e=" + new Date().getTime(), function() {
        checkUserData(myForm2, log2);
    });
 
}
 
function checkUserData(form, log) {
 
    // add some user data manualy
    form.setUserData("type", "have_account", "check_msg", false);
    form.setUserData("proceed", "session_id", "ZkRhMY");
 
    // read userdata
    log("form loaded, attempt to read userdata<br>");
    log("input 'Login', <span style='color:blue;'>userdata</span>: max_length, <span style='color:green;'>value</span>: " + form.getUserData("login", "max_lentgh") + "<br>");
    log("input 'Login', <span style='color:blue;'>userdata</span>: exp_days, <span style='color:green;'>value</span>: " + form.getUserData("login", "char_allowed") + "<br>");
    log("radiobutton 'Already have account', <span style='color:blue;'>userdata</span>: check_session, <span style='color:green;'>value</span>: " + form.getUserData("type", "have_account", "check_session").toString() + "<br>");
    log("radiobutton 'Already have account', <span style='color:blue;'>userdata</span>: exp_days, <span style='color:green;'>value</span>: " + form.getUserData("type", "have_account", "exp_days") + "<br>");
    log("radiobutton 'Already have account', <span style='color:blue;'>userdata</span>: check_msg, <span style='color:green;'>value</span>: " + form.getUserData("type", "have_account", "check_msg").toString() + "<br>");
    log("button 'Proceed', <span style='color:blue;'>userdata</span>: skip_validation, <span style='color:green;'>value</span>: " + form.getUserData("proceed", "skip_validation").toString() + "<br>");
    log("button 'Proceed', <span style='color:blue;'>userdata</span>: session_id, <span style='color:green;'>value</span>: " + form.getUserData("proceed", "session_id") + "<br>");
 
}
 
function log(t) {
    if (!logObj)
        logObj = document.getElementById("simpleLog");
    logObj.innerHTML += t;
}
 
function log2(t) {
    if (!logObj2)
        logObj2 = document.getElementById("simpleLog2");
    logObj2.innerHTML += t;
}</script>
 
 
    <table>
        <tr>
            <td><div id="myForm"></div></td>
            <td><div id="myForm2"></div></td>
        </tr>
        <tr>
            <td><b>Log</b></td>
            <td><b>Log</b></td>
        </tr>
        <tr>
            <td><div id="simpleLog"></div></td>
            <td><div id="simpleLog2"></div></td>
        </tr>
    </table>