<link rel="stylesheet" type="text/css" href="../../codebase/skins/dhtmlxform_dhx_skyblue.css">
    <link rel="stylesheet" type="text/css" href="../../../dhtmlxGrid/codebase/dhtmlxgrid.css">
    <link rel="stylesheet" type="text/css" href="../../../dhtmlxGrid/codebase/skins/dhtmlxgrid_dhx_skyblue.css">
    <script src="../../codebase/dhtmlxcommon.js"></script>
    <script src="../../codebase/dhtmlxform.js"></script>
    <script src="../../codebase/ext/dhtmlxform_item_container.js"></script>
    <script src="../../../dhtmlxGrid/codebase/dhtmlxgrid.js"></script>
    <script src="../../../dhtmlxGrid/codebase/dhtmlxgridcell.js"></script>
    <script>
var myForm,
formData,
grid;
function doOnLoad() {
    formData = [{
        type: "settings",
        labelWidth: 130,
        inputWidth: 170
    }, {
        type: "input",
        label: "Full Name",
        value: "Kaapori Lumikaastra"
    }, {
        type: "input",
        label: "Email",
        value: "kaapori.lumi@gmail.com"
    }, {
        type: "container",
        name: "myGrid",
        label: "Select Product",
        inputWidth: 330,
        inputHeight: 200
    }];
    myForm = new dhtmlXForm("myForm", formData);
 
    grid = new dhtmlXGridObject(myForm.getContainer("myGrid"));
    grid.setSkin("dhx_skyblue");
    grid.setImagePath("../../../dhtmlxGrid/codebase/imgs/");
    grid.loadXML("../common/grid.xml?etc=" + new Date().getTime());
 
    // enabled/disabled mode see in 04_events/09_container_events.html
    grid.attachEvent("onEditCell", function() {
        return false;
    });
 
}</script>
 
 
    <div id="myForm"></div>