<meta charset="UTF-8">
    
    <link rel="stylesheet" type="text/css" href="../../codebase/skins/dhtmlxpopup_dhx_skyblue.css"/>
    <link rel="stylesheet" type="text/css" href="../../../dhtmlxForm/codebase/skins/dhtmlxform_dhx_skyblue.css"/>
    <script src="../../codebase/dhtmlxcommon.js"></script>
    <script src="../../codebase/dhtmlxpopup.js"></script>
    <script src="../../../dhtmlxForm/codebase/dhtmlxform.js"></script>
    
    <script>
 
var myPop;
var myForm;
 
function doOnLoad() {
 
    myForm = new dhtmlXForm("myForm", [{
        type: "settings",
        position: "label-left",
        labelWidth: 120,
        inputWidth: 120
    }, {
        type: "input",
        name: "name",
        label: "Full Name / Nick",
        value: "Ogiwara Masaaki"
    }, {
        type: "password",
        name: "pwd",
        label: "Password",
        value: "12345"
    }, {
        type: "button",
        name: "proceed",
        value: "Proceed"
    }]);
    myForm.setSkin("dhx_skyblue");
 
    myPop = new dhtmlXPopup({
        form: myForm,
        id: ["name", "pwd"]
        });
    myPop.attachHTML("Please enter something<br>Second line<br>One more line here");
 
    myForm.attachEvent("onFocus", function(id, value) {
        if (typeof(value) != "undefined")
            id = [id, value];
        // for radiobutton
        myPop.show(id);
    });
    myForm.attachEvent("onBlur", function(id, value) {
        myPop.hide();
    });
 
}</script>
    <style>
        
        
    </style>
 
 
    <div id="myForm"></div>