title: How do I fill multiple textboxes with data based on first text box input?
body: <p>Lets say I have a database table with 3 columns: accref, company and contact and 3 matching textboxes.</p>
  
  <p>I have already implemented a autosuggest feature for accref textbox which will suggest database values for the accref column. What I want is when I click on a suggested value in the accref textbox, I want the company and contact boxes to fill with the data that is in the same row as the accref.</p>
  
  <p>For example,</p>
  
  <p>table:</p>
  
  <p>accref: HFHFHF</p>
  
  <p>company: the goverment</p>
  
  <p>contact: Barack Obama</p>
  
  <p>When I type HFH in the accref textbox, the HFHFHF record shows up as a suggestion. Then when i click on that suggestion(it shows as a div), I want it to fill in the company text box with "The goverment" and then the contact textbox with "Barack Obama"</p>
  
  <p>index.php:</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
  &lt;title&gt;tst&lt;/title&gt;
  &lt;script type="text/javascript" src="//code.jquery.com/jquery-1.8.0.min.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript"&gt;
  $(function(){
  $(".search_keyword").keyup(function() 
  { 
      var search_keyword_value = $(this).val();
      var dataString = 'search_keyword='+ search_keyword_value;
      if(search_keyword_value!='')
      {
          $.ajax({
              type: "POST",
              url: "search.php",
              selectFirst: true,
              data: dataString,
              cache: false,
              success: function(html)
                  {
                      $("#result").html(html).show();
                  }
          });
      }
      return false;   
  });
  
  $("#result").live("click",function(e){
      var $clicked = $(e.target);
      var $name = $clicked.find('.accref_name').html();   
      var decoded = $("&lt;div/&gt;").html($name).text();
      $('#search_keyword_id').val(decoded);
  
  
  
  });
  
  $(document).live("click", function(e) { 
      var $clicked = $(e.target);
      if (! $clicked.hasClass("search_keyword")){
          $("#result").fadeOut(); 
      }
  });
  
  
      $("#")
  
  
  
  });
  
  
  &lt;/script&gt;
  
  &lt;/script&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
      &lt;div class="main"&gt;
          &lt;input type="text" class="search_keyword" id="search_keyword_id" placeholder="Cus ref"/&gt;
          &lt;input type="text" class="comp_get" placeholder="Company"/&gt;
  
  
  
          &lt;div id="result"&gt;&lt;/div&gt;
  
      &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>And search.php:</p>
  
  <pre><code>&lt;?php
      include('db_connection.php');
      if(isset($_POST['search_keyword']))
      {
          $search_keyword = $dbConnection-&gt;real_escape_string($_POST['search_keyword']);
          $sqlQuery="SELECT db_accref, db_company FROM tbl_customers WHERE db_accref LIKE '%$search_keyword%'";
          $resAccref=$dbConnection-&gt;query($sqlQuery);
  
          if($resAccref === false) {
              trigger_error('Error: ' . $dbConnection-&gt;error, E_USER_ERROR);
          }else{
              $rows_returned = $resAccref-&gt;num_rows;
                      }
  
      $bold_search_keyword = '&lt;strong&gt;'.$search_keyword.'&lt;/strong&gt;';
      if($rows_returned &gt; 0){
              while($rowAccref = $resAccref-&gt;fetch_assoc()) 
              {       
                  echo '&lt;div class="show" align="left"&gt;&lt;span class="accref_name"&gt;'.str_ireplace($search_keyword,$bold_search_keyword,$rowAccref['db_accref']).'&lt;/span&gt;&lt;/div&gt;';    
              }
          }else{
              echo '&lt;div class="show" align="left"&gt;&lt;/div&gt;';   
          }
      }   
  ?&gt;
  </code></pre>
  
  <p>How can I do this?</p>
  
  <p>Thanks for any help and sorry if I havent made the question clear enough.</p>
  
  <p>Mike</p>