DHTMLX Docs & Samples Explorer

Data binding

Data in form can be linked with server side datasource. When field id binded to data, it will be filled with related value during load operation and updated in DB during save operation.

So if you have field in connector's config with name ( alias ) “someFieldA” and has some input with bind=“someFieldA” , then values of DB field and such input will be in sync.

Data-binding can be done in 3 ways

Bind from form contstructor

You can use bind property (attribute) when constructing from.

var formData = [
        {type: "text", name: "UserName", value: "", label: "User Name", bind: "name"}
    ];
 var dhxForm = new dhtmlXForm("dhxFormObj", formData);

Bind from HTML markup

If html element, inside form, has “bind” attribute - it will be bind to the related data-name automatically.

<table width="400" id="myForm">
    <tr>
        <th align="left">Customer ID</th>
        <td><span bind="customer_id" ></span>&nbsp;</td>
    </tr>
    <tr>
        <th align="left">Customer Name</th>
        <td><input bind="name" validate="required" type="text" /></td>
        <td><input command="save" type="button" value="Update" /></td>
    </tr>
    <tr>
        <th scope="row" align="left">Customer Address</th>
        <td><textarea bind="customer_address" ></textarea></td>
        <td><input command="delete" type="button" value="Delete" /></td>
    </tr>
</table>
    myform = new dhtmlXForm("myForm"); //bind all inputs inside myForm

Bind by js command

You can bind field to the datasource by usind bindField command

    myform.bindField(someId, "someDBFieldName")