Data Format Supporting

DhtmlxForm allows you specify controls in different formats. Possible configuration formats are:

• JSON
• XML
• HTML

Firstly, you need to create an object with incoming data:

var formData = [
    {type: "radio", name: "color", value: "r", label: "Red", checked: true},
    {type: "radio", name: "color", value: "g", label: "Green"},
    {type: "radio", name: "color", value: "b", label: "Blue"}
];

Then, to create a new instance of dhtmlxForm:

var dhxForm = new dhtmlXForm("dhxFormObj", formData);

Details of JSON configuration

In this case, you need to create an UL object with class name 'dhtmlxForm', and it will automatically replaced with dhtmlxForm according to the struct:

<ul class="dhtmlxForm">
     <li ftype="radio" name="color" value="r" checked="true">Red</li>
     <li ftype="radio" name="color" value="g">Green</li>
     <li ftype="radio" name="color" value="b">Blue</li>
</ul>

Details of HTML configuration

In the beginning, you need to create an XML file with dhtmlxForm data (it can be either static xml file, or any programming script with proper XML in response):

<items>
   <item type="radio" name="color" value="r" checked="true" label="Red"/>
   <item type="radio" name="color" value="r" label="Green"/>
   <item type="radio" name="color" value="r" label="Blue"/>
</items>

Then, to init dhtmlxForm and load XML into it:

var dhxForm = new dhtmlXForm("dhxFormObj"); 
dhxForm.loadStruct("dhxForm.xml");

Loading from XML string is also supported:

var dhxForm = new dhtmlXForm("dhxFormObj"); 
dhxForm.loadStructString('<items><item type="radio" name="color" ...');

Details of XML configuration