DHTMLX Docs & Samples Explorer

Index
dhtmlxForm

# Data binding

Data in the form can be linked with a server-side datasource. When field id is 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 file 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) during form construction from XML, JSON or HTML list.

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

## Bind from HTML markup

If an 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 using bindField command.

    myform.bindField(someId, "someDBFieldName")