DHTMLX Docs & Samples Explorer

HTML

We can single out HTML initialization from other available ways. The reason - it's some kind of automatic initialization. After the page has been completely parsed - the form instance 'looks for' HTML data for initialization. If it finds the appropriate data - it's used for initialization.

Initial Data

As initial data we'll take the following form:

Configuration

In HTML the data will look as:

<ul class="dhtmlxForm" name="myForm">
     <li ftype="fieldset" name="data" inputWidth="auto">Welcome
        <ul>
             <li ftype="input" name="name">Login</li>
             <li ftype="password" name="pass">Password</li>
	     <li ftype="button" name="save" value="Proceed"/>
        </ul>
     </li>
</ul>

HTML Code

welcome(html).html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
	<link rel="stylesheet" type="text/css" href="codebase/skins/dhtmlxform_dhx_skyblue.css">
        <script src="codebase/dhtmlx.js" type="text/javascript"></script>
        <link rel="STYLESHEET" type="text/css" href="codebase/dhtmlx.css">
 
        <script>
               <div id="form_container" style="width:250px;height:300px;"></div>
 
		function doOnFormInit() {
			// will be called immediately after form initialization
		}
	</script>
 
</head>
 
<body>
   <ul class="dhtmlxForm" name="myForm" oninit="doOnFormInit">
     <li ftype="fieldset" name="data" inputWidth="auto">Welcome
        <ul>
             <li ftype="input" name="name">Login</li>
             <li ftype="password" name="pass">Password</li>
	     <li ftype="button" name="save" value="Proceed"/>
        </ul>
     </li>
   </ul>
</body>
</html>
  • name - the identification name of element (both items and form itself). You can refer to the appropriate element through the value stated there.
  • oninit - defines the function that will be called immediately after form initialization.