How to use jQuery's formatItem, formatMatch, & formatResult options for autocomplete?

**BaseballGraphs** · Nov 20 '10, 08:00 PM

Hello,

I am making use of jQuery's .autocomplete plugin, and I would appreciate some assistance formating the results that show up in the dropdown menu that populates when text is written into the input field.

In order to get the data to populate the autocomplete, I pull from mySQL using this PHP:

Code:

 $sql = ( 'SELECT tag, title, author, content, id FROM labels' );
 $result = mysql_query( $sql );
 $Response = array();
 while( $row = mysql_fetch_object( $result ) ){
 $Response[] = array(
                           "id" => $row->id,
                           "name" => $row->tag . ": " . $row->title . ": " . $row->content .""
                         );
 }

When a user selects the option from the autocomplete that is best for them, I convert the "name" above into the "id" using this method:

Code:

  var AllTagData = <?= json_encode ( $Response ); ?>;
  var CRs = [];

  for(var i in AllTagData){
     Tags.push(AllTagData[i].name);
  }

  function getIdFromTag(_name){
      for(var i in AllTagData){
          if(_name == AllTagData[i].name){
              return AllTagData[i].id;
          }
      }
  }

So far, so good. Finally, I use the jQuery autocomplete plugin to output the data for the user:

Code:

$(document).ready(function(){
     $("#Responses").autocomplete({
         source: Tags,
         matchContains: true,
         autoFill: true,
         select: function(e, ui){
             $("#hidden_tags").val( getIdFromTags($("#Responses").val()) );
          }});
 });

This final portion of the code is where I need help implementing the formatItem, formatMatch, and formatResult options.

From the PHP given above, I output Tags, Title, and Content all in the "name". The way that I would like to format my autocomplete options for the user is

Show Tags & Title
Hide Content
Search through Tags, Title, and Content for possible matches

Therefore, even though I want the autocomplete to search through Content, I don't want Content showing up in the populated autocomplete list. I only want the Tags and Title to show.

I've been having a lot of trouble with this and have searched quite extensively to find an answer and would really appreciate any help you can give on how to accomplish this. Please ask any follow up questions if you need further clarification. Thanks!