Check documentation for the latest version of dhtmlxSuite Form Specific HowTos DHTMLX Docs

Form Specific HowTos

How can I populate the 'combo' item with data from db?

To define options of the 'combo' item you should use ComboConnector on the server side and specify the connector parameter for the appropriate item on the client side:

client side:

var formData = [{
    type: "combo", 
    name: "myCombo", 
    label: "Select type", 
    connector:"http://localhost:8080/combo_connector"
}];

server side:

Connection conn = ( new DataBaseConnection()).getConnection();
СomboConnector data = new ComboConnector(conn);
data.render_table("categories","id","valueColumn, labelColumn");
  • Names of the fields can have aliases (value or label) to identify the appropriate attribute.
data.render_sql(
    "SELECT *, CONCAT(FirstName, LastName) as label FROM table1",
    "id",
    "id,FirstName(label)"
);

Note, in the filtering mode a combo filters data by the "label" field.

How can I load data from db?

To load data to a form you should use FormConnector on the server side and the method load (id) on the client side:

client side

myForm.load('formdata.php?id=1');

where a connector file with the id of loading record must be specified as the parameter.

The values of record's columns will be used as values of form's controls.

server side

public class DataBaseConnection {
    Connection getConnection(){
        Connection conn=null;
    try {
        Class.forName ("com.mysql.jdbc.Driver").newInstance ();
        conn = DriverManager.getConnection(
            "jdbc:mysql://localhost/sampledb?characterEncodingTF-8", 
            "root", 
            ""
        );
    } catch (Throwable e) {
        e.printStackTrace();
      }
    return conn;
  }
}

and

import com.dhtmlx.connector.ConnectorServlet;
import com.dhtmlx.connector.DBType;
import com.dhtmlx.connector.FormConnector;
 
import java.sql.Connection;
 
public class AppServer extends ConnectorServlet {
 
 /**
  *
  */ 
 private static final long serialVersionUID = 1L;
 
 /* (non-Javadoc)
 
 * @see com.dhtmlx.connector.ConnectorServlet#configure()
 */
 @Override
 protected void configure() {
  Connection conn = ( new DataBaseConnection()).getConnection();
  FormConnector data = new FormConnector(conn);
  data.render_table("customers","id","name, address, email");
 }
}

How can I save changes made in a form to db?

To save form changes to DB, you should use the method save() on the client side.

You can call this method, for example, on clicking some button.

myForm.attachEvent("onButtonClick", function(id){
    if (id=='saveButton'){
        myForm.save();
    }
}
Back to top