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]).