We’ve further enhanced PHP Grid and JQuery UI Autocomplete integration.
Types and Steps shows how to integrate database driven type ahead / autocomplete by lookup sql query.

1) Basic Typeahead (single field)

Step1: Set formatter to autocomplete on desired column

$col["formatter"] = "autocomplete"; // autocomplete

Step2: Set format options query. The field in sql aliased ‘v’ will be shown in list

// Fill the name field with query values typeahead
$col["formatoptions"] = array(	"sql"=>"SELECT name as v FROM clients", "update_field"=>"name");

2) Autofill other field.

The field ‘company’ will be filled w.r.t. selected name.

$col["formatoptions"] = array(	"sql"=>"SELECT company as k, name as v FROM clients","update_field"=>"company");

The field aliased ‘k’ will be set in the ‘updated_field’ column (e.g. company)

3) Callback function

Connect a callback function that will auto-fill multiple fields.

$col["formatoptions"] = array(	"sql"=>"SELECT *, name as v FROM clients", "callback"=>"fill_form");

and in html part, define callback JS function.

<script>
function fill_form(data)
{
    jQuery("input[name=gender].FormElement").val(data.gender);
    jQuery("textarea[name=company].FormElement").val(data.company);

    jQuery("input[name=gender].editable").val(data.gender);
    jQuery("textarea[name=company].editable").val(data.company);
}
</script>

References: Sample Code and Live demo

Active license subscription OR those who wish to renew subscription can get updated build by contacting via email ([email protected]).