473,503 Members | 1,691 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

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

75 New Member
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:
Expand|Select|Wrap|Line Numbers
  1.  $sql = ( 'SELECT tag, title, author, content, id FROM labels' );
  2.  $result = mysql_query( $sql );
  3.  $Response = array();
  4.  while( $row = mysql_fetch_object( $result ) ){
  5.  $Response[] = array(
  6.                            "id" => $row->id,
  7.                            "name" => $row->tag . ": " . $row->title . ": " . $row->content .""
  8.                          );
  9.  }
  10.  
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:
Expand|Select|Wrap|Line Numbers
  1.   var AllTagData = <?= json_encode ( $Response ); ?>;
  2.   var CRs = [];
  3.  
  4.   for(var i in AllTagData){
  5.      Tags.push(AllTagData[i].name);
  6.   }
  7.  
  8.   function getIdFromTag(_name){
  9.       for(var i in AllTagData){
  10.           if(_name == AllTagData[i].name){
  11.               return AllTagData[i].id;
  12.           }
  13.       }
  14.   }
  15.  
So far, so good. Finally, I use the jQuery autocomplete plugin to output the data for the user:
Expand|Select|Wrap|Line Numbers
  1. $(document).ready(function(){
  2.      $("#Responses").autocomplete({
  3.          source: Tags,
  4.          matchContains: true,
  5.          autoFill: true,
  6.          select: function(e, ui){
  7.              $("#hidden_tags").val( getIdFromTags($("#Responses").val()) );
  8.           }});
  9.  });
  10.  
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!
Nov 20 '10 #1
0 2069

Sign in to post your reply or Sign up for a free account.

Similar topics

1
1829
by: c19h28o2 | last post by:
Hi, I'm a little stuck with Ajax (really am not getting it at the moment!) I'm trying to write into a div when something is typed into a box... <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML...
1
49849
by: mikeh3275 | last post by:
I'm new to developing in jQuery, so I'm probably doing this wrong. I'm loading a form into a modal dialog box and I'm trying to assign a click event to the button in the form, but I can't seem to...
53
8315
by: souporpower | last post by:
Hello All I am trying to activate a link using Jquery. Here is my code; <html> <head> <script type="text/javascript" src="../../resources/js/ jquery-1.2.6.js"</script> <script...
0
3337
by: metaphysics | last post by:
I am using a jQuery script called LocalScroll, and I have a quick problem that needs fixing. The demo for the script is here: jQuery.LocalScroll - Regular Demo, and the documentation is here: Ariel...
5
4902
by: jrod11 | last post by:
hi, I found a jquery html table sorting code i have implemented. I am trying to figure out how to edit how many colums there are, but every time i remove code that I think controls how many colums...
0
2289
by: bytesFTW99 | last post by:
i have this, $(function() { $('#input').autocomplete('test.php', {json: true}); }); that bring back values from the database here is my php section
2
2821
pradeepjain
by: pradeepjain | last post by:
http://www.electrictoolbox.com/jquery-count-words-textarea-input/ hi guys i want to build a autocomplete feature in a textarea . so i thought of like when ever the word count increases call the...
2
6027
by: RichRadio | last post by:
Hi, I have the following script within a user control <script type="text/javascript" src="js/jquery-1.3.2.min.js"></script> <script type="text/javascript"> ...
0
2751
by: aucontraire | last post by:
I'm using a swf as a background for all of the content on a site. Every page has the same background (swf) but with different amount of content. I want to sync the height of the div of the content...
0
7089
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
0
7282
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...
0
7339
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...
1
6995
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows...
0
3168
by: TSSRALBI | last post by:
Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The...
0
3157
by: adsilva | last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
0
1515
by: 6302768590 | last post by:
Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated ...
1
738
muto222
by: muto222 | last post by:
How can i add a mobile payment intergratation into php mysql website.
0
389
bsmnconsultancy
by: bsmnconsultancy | last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.