Download and unzip the contents of the archive to any convenient location. The package contains the following folders:

- [php] - Contains the jqAutocomplete PHP class and the optional driver files for the appropriate database.
- [themes] - Contains the themes shipped with the product. Since jqAutocomplete supports jQuery UI Themeroller, any theme compatible with jQuery UI ThemeRoller will work for jqAutocomplete as well. Therefore, the package contains just one theme ("Redmond"). You can download any additional themes directly from jQuery UI's ThemeRoller site available here:

http://jqueryui.com/themeroller/

Just add "Redmond" theme in your PHP/HTML file.

<link rel="stylesheet" type="text/css" href="themes/redmond/jquery-ui.custom.css" />

- [js] - The javascript files of jqAutocomplete (and the needed libraries). You need to include them in your PHP page.

The first file is "jquery.js" - this is the official jQuery library.
The second file is "jquery-ui.custom.min.js" - this is the jQuery UI library.
The final result you will have in an PHP page containing jqAutocomplete would be something similar to that:

<!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> ...... <div class="ui-widget"> <label for="company">Company: </label> <input id="company" /> </div> <?php include "firstautocomplete.php";?> ....... </body> </html>

Save the file as autocomplete.php or any desired name in the root directory.

In the root directory you will find a file named jq-config.php. Open the file and enter the appropriate information for the connection to the database. Save the file and then create a file firstautocomplete.php with the following content.

<?php // include the Database driver class (we will use PDO). require_once 'jq-config.php'; require_once "php/jqGridPdo.php"; // include the jqUtils Class. The class is needed in all jqSuite components. require_once "php/jqUtils.php"; // include the jqAutocomplete Class require_once "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"); $ac = new jqAutocomplete($conn); // We use the northwind database // Set the SQL command $ac->SelectCommand = "SELECT CompanyName FROM customers WHERE CompanyName LIKE ? ORDER BY CompanyName"; // Set from where to get the dat. In this case from the same file $ac->setSource("firstautocomplete.php"); // Enjoy $ac->renderAutocomplete("#company"); ?>

Run the file autocomplete.php from your web browser. All subsequent requests the autocomplete needs will be forwarded back to the "firstautocomplete.php" file and the component will automatically handle the requests and provide the needed response - no need for custom coding.