For this purpose let suppose that the another input field is the product. The index file will look like this:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>My First PHP jqAutocomplete </title> <link rel="stylesheet" type="text/css" media="screen" href="themes/redmond/jquery-ui.custom.css" /> <script src="js/jquery.js" type="text/javascript"></script> <script src="js/jquery-ui-1.8.1.custom.min.js" type="text/javascript"></script> </head> <body> <form action="#"> <label for="company">Company: </label> <input id="company" /> <br/> <label for="product">Product: </label> <input id="product" /> <br/> <input type="submit" name="submit" value="Submit" /> </form> <?php include "autocomplete.php";?> </body> </html>
And the autocomplete.php file
<?php require_once '../../../jq-config.php'; require_once ABSPATH."php/jqGridPdo.php"; require_once ABSPATH."php/jqUtils.php"; require_once ABSPATH."php/jqAutocomplete.php"; // Connection to the server $conn = new PDO(DB_DSN,DB_USER,DB_PASSWORD); // Tell the db that we use utf-8 $conn->query("SET NAMES utf8"); // create autocomplete instance $ac = new jqAutocomplete($conn); //write the select command $ac->SelectCommand = "SELECT CompanyName FROM customers WHERE CompanyName LIKE ? ORDER BY CompanyName"; // set the source from where to get data. In this case it is the same file. $ac->setSource("autocomplete.php"); $ac->renderAutocomplete("#company"); // Create the second instance $ac2 = new jqAutocomplete($conn); //write the select command for the products $ac2->SelectCommand = "SELECT ProductName FROM products WHERE ProductName LIKE ? ORDER BY ProductName"; // set the source from where to get data. In this case it is the same file. $ac2->setSource("autocomplete.php"); // Enjoy $ac2->renderAutocomplete("#product"); ?>