title: auto suggest ajax for php
body: <p>i have an html form ,php scrip and jquery. i need a ajax code to make auto suggest from my php script. following is the code...  </p>
  
  <p><strong>Form.html</strong>  </p>
  
  <pre><code>  &lt;html&gt;
      &lt;head&gt;
        &lt;script src="jquery1.6.4.min.js" type="text/javascript"&gt;&lt;/script&gt;  
        &lt;script src="jquery.jSuggest.js" type="text/javascript"&gt;&lt;/script&gt;  
        &lt;link href="jSuggest.css" rel="stylesheet" type="text/css" /&gt;  
       &lt;/head&gt;  
       &lt;body&gt;  
         &lt;form id="form1" name="form1" method="post" action="#"&gt;  
            &lt;input type="text" name="TagsInputField" id="TagsInputField"/&gt;  
          &lt;/form&gt;  
        &lt;/body&gt;  
    &lt;/html&gt;  
  </code></pre>
  
  <p><strong>TEST.php</strong>  </p>
  
  <pre><code>  &lt;?php 
        include("bc/script/core/dbcon.php");  
        $input = $_POST['TagsInputField'];  
        $data = array();  
        // query your DataBase here looking for a match to $input  
        $query = mysql_query("SELECT * FROM user WHERE username LIKE '%$input%'");  
        while ($row = mysql_fetch_assoc($query)) {  
          $json = array();  
          $json['value'] = $row['id'];  
          $json['name'] = $row['username'];  
          $data[] = $json;  
        }  
        header("Content-type: application/json");  
        echo json_encode($data);  
     ?&gt;  
  </code></pre>
  
  <p><strong>jquery.jSuggest.js</strong></p>
  
  <pre><code> $(function() {
      var dataSource = {
          items: [
              {
              value: "21",
              name: "Mick Jagger"},
          {
              value: "43",
              name: "Johnny Storm"},
          {
              value: "46",
              name: "Richard Hatch"},
          {
              value: "54",
              name: "Kelly Slater"},
          {
              value: "79",
              name: "Michael Jordan"}
          ]
  
      };
  
      $('#TagsInputField').jSuggest({
          source: dataSource.items,
          selectedItemProp: "name",
          seekVal: "name",
          selectionAdded: function(elem, data) {
              console.log(data.name);
          },
          selectionRemoved: function(elem, data) {
              console.log(data.name);
              elem.remove();
          }
      });
  });
  </code></pre>
  
  <p>notice the pointer "source" it is refering to an object "dataSource.items" to read suggesions.
  can any one help me to write an ajax code to read suggesions fom php file which is returning a json.</p>