Dhtmlx Components Integration

Pretty often, there is the situation when you need to combine form with some other dhtmlx components.
DhtmlxForm allows you to combine form with the next components:

• Layout
• Window
• Accordion
• Tabbar

Lets consider the first variant in details.

To implement form attaching you need to do the following:
1. Download the dhtmlxLayout package from the server and place it in a folder.
2. Include related js and css files into the header of html file .

<link rel="stylesheet" type="text/css" href="../../../codebase/dhtmlxlayout.css">
<link rel="stylesheet" type="text/css" href="../../../codebase/skins/dhtmlxlayout_dhx_skyblue.css">
<script src="../../../codebase/dhtmlxcommon.js"></script>
<script src="../../../codebase/dhtmlxlayout.js"></script>	
<script src="../../../codebase/dhtmlxcontainer.js"></script>

3. Create a layout object. The step depends on the type of layout initialization (for detailed information about layout initialization see the respective part of the documentation). We will consider 'object-based' variant. In this case, your further actions are:

• Specify an HTML container for your future layout.

<div id="parentId" style="position:absolute; width:600px; height:400px;"></div>

• Create a new dhtmlXLayoutObject.

var dhxLayout = new dhtmlXLayoutObject("parentId", "3L", "dhx_black")

4. And now, when all preparations is finished, the last and most principal step is left - add the form to layout. Here the method attachForm() will help us.

var dhxForm = dhxLayout.cells("a").attachForm();

Attaching is completed and you can continue your subsequent work.