How to Load data from database and bind to select

Using your dhtmlXForm samples I can make a form and load data from a database and I can load all the data into a select box, but how is it possible to “bind” it to the correct field, so the corresponding id is selected in the selectfield?

I want the following:

table markers (marker_id, name, address, city, provinceID, phone, …)

table provinces (province_id, province_name)

The form markers contains all the fields as in the table specs and I want a select box showing the selected value for the corresponing province (marker.provinceID=provinces.province_id)

Is this possible?

Please check example here … tions.html
Firs select box options is loaded from data base.
You can find source of this example at your dhtmlxForm package

I already did use this example as base. It always loads all values from the table provinces. The question now is how to connect it to the table marker.provinceID and mark it seleted,
like in

<select name="provinceID">
<option value="province_id" selected>province_name</option>


Are you italian?

Is there an answer for this case !?

You need to set bind attribute. Please see the sample in the form 2.6 package:


found the solution, made a mistake in the id to use in de load function. used the beta dhtmlXform 3.0 (see the blog).

see my function to load the formdata

function frmMarker() {

    if (formMarker == null) {

        window.dhx_globalImgPath = "/dhx/dhtmlxCombo/codebase/imgs/";  = "dhx_skyblue";

        dhtmlx.image_path = "/dhx/dhtmlxEditor/codebase/imgs/";

        var formData = [

            {type: "newcolumn"},

            {type: "fieldset", label: "Location", list:[

                {type: "settings", position: "label-left", labelWidth: 80 ,inputWidth: 335},

                {type: "input",  name: "name",       label:"Markername", validate:  "NotEmpty", value: ""},

                {type: "input",  name: "address",    label:"Address",    validate:  "NotEmpty", value: ""},

                {type: "input",  name: "city",       label:"City",       validate:  "NotEmpty", value: ""},

                {type: "input",  name: "zipcode",    label:"Zip-code",   validate:  "NotEmpty", value: ""},

                {type: "select", name: "provinceID", label:"Province",   connector: "options_provinces.php", bind:"provinceID"},


            {type: "fieldset", label: "Star Rating",  list:[

                {type: "block", inputWidth: "auto", inputWidth: 435, list:[

                    {type: "newcolumn"},{type: "radio", name: "stars",  position: "label-right", value: "1", label: "1"},

                    {type: "newcolumn"},{type: "radio", name: "stars",  position: "label-right", value: "2", label: "2"},

                    {type: "newcolumn"},{type: "radio", name: "stars",  position: "label-right", value: "3", label: "3"},

                    {type: "newcolumn"},{type: "radio", name: "stars",  position: "label-right", value: "4", label: "4"},

                    {type: "newcolumn"},{type: "radio", name: "stars",  position: "label-right", value: "5", label: "5"},

                    {type: "newcolumn"},{type: "radio", name: "stars",  position: "label-right", value: "6", label: "6"},

                    {type: "newcolumn"},{type: "radio", name: "stars",  position: "label-right", value: "7", label: "7"},



            {type: "fieldset", label: "Property",  list:[

                {type: "settings", position: "label-left", labelWidth: "auto" ,inputWidth: 300},

                {type: "label",  label:"Marker location (Lat/Lon)"},

                {type: "input",  id: "lattitude", name: "lattitude", label:"LAT", validate: "^-?([1-8]?[1-9]|[1-9]0)[.]{1}[0-9]{1}", value: ""},                      //[-]?[0-9]*[.]?[0-9]+

                {type: "input",  id: "longitude", name: "longitude", label:"LON", validate: "^-?([1]?[1-7][1-9]|[1]?[1-8][0]|[1-9]?[0-9])[.]{1}[0-9]{1}", value: ""}, //[-]?[0-9]*[.]?[0-9]+

                {type: "label",  label:"Marker near the following route"},

                {type: "select", name: "route_id",   label:"Route",      connector: "options_routes.php", bind:"route_id"},


                {type: "label",  label:"Facilities"},

                {type: "block", inputWidth: 300, labelWidth: 75, list:[

                    {type: "checkbox", name: "parking_on_site",  bind: "parking_on_site",  position: "label-right", value: "1", label: "Parking on site"},

                    {type: "checkbox", name: "child_friendly",   bind: "child_friendly",   position: "label-right", value: "1", label: "Child Friendly"},

                    {type: "checkbox", name: "invalid_friendly", bind: "invalid_friendly", position: "label-right", value: "1", label: "Invalide Friendly"}



            {type: "block", inputWidth: "1", inputWidth: 500, list:[

                {type: "button", name: "btn2", value: "Save Changes",            command: "customCommand"},

                {type: "button", name: "btn1", value: "Reset form data",         command: "customCommand"},

                {type: "newcolumn"},

                {type: "button", name: "btn3", value: "Validate",                command: "customCommand"},

                {type: "button", name: "btn4", value: "Clear validation errors", command: "customCommand"},

                {type: "newcolumn"},

                {type: "label",  name: "lblMsgValidate", id: "lblMsgValidate", style: "color: green", label:""},


            {type: "newcolumn"},

            {type: "fieldset", label: "Contact",  list:[

                {type: "settings", position: "label-left", labelWidth: 80 ,inputWidth: 325},

                {type: "input",  name: "phone",     label:"Phone",    validate:  "NotEmpty", value: "" },

                {type: "input",  name: "fax",       label:"Fax",      value: ""},

                {type: "input",  name: "website",   label:"Website",  value: ""},

                {type: "input",  name: "email",     label:"E-mail",   validate:  "NotEmpty,ValidEmail",  value: ""},


            {type: "fieldset", label: "Times to check in / check out",  list:[

                {type: "settings", position: "label-left", labelWidth: 80 ,inputWidth: 325},

                {type: "input",  name: "checkin",   label:"Check in from",  validate: "^([0-1]?[0-9]|[2][0-3]):([0-5][0-9])$", value: ""},

                {type: "input",  name: "checkout",  label:"Check out from", validate: "^([0-1]?[0-9]|[2][0-3]):([0-5][0-9])$", value: ""},



            {type: "fieldset", label: "Marker Description", list:[

                {type: "editor", name: "description", label: "", bind: "description",labelWidth: 1, inputWidth: 415, inputHeight: 240, value: ""},



        formMarker = dhxTabbar.cells("a5").attachForm(formData);


        formMarker.attachEvent("onButtonClick", function(name) {

            if(name=="btn1") {

                // Reset data to original state


            } else if(name=="btn2") {

                // If valid save data and reload grid markers

                if (formMarker.validate()){    



                    formMarker.setItemLabel("lblMsgValidate", "Saved Changes");

                } else {

                    // form is not valid or filled in correctly

                    formMarker.setItemLabel("lblMsgValidate", "Form is NOT Valid");


            } else if (name=="btn3") {

                // validate form

                if (formMarker.validate()) {

                //    alert ("Form is valid");

                    formMarker.setItemLabel("lblMsgValidate", "Form is Valid");

                } else {

                //    alert ("Some fields are not Valid");

                    formMarker.setItemLabel("lblMsgValidate", "Form is NOT Valid");


            } else if(name=="btn4")    {

                // reset validate errors


                formMarker.setItemLabel("lblMsgValidate", "");





    dpFrmMarker = new dataProcessor("connector_form_marker.php?id="+g_marker_id);

    //dpFrmMarker.setTransactionMode("POST", true);