Load a page according to jQuery's autocomplete plugin

Posted on 2009-02-14
Medium Priority
Last Modified: 2012-05-06
This should be trivial.

See the snippet below, using jQuery's autocomplete plugin (http://docs.jquery.com/Plugins/Autocomplete). It gives me two input boxes, one in which I can search users by their last name, the other by their username. I type a few letters, get a few suggestions, press enter and the last name or username appears. Up to that part, the documentation was good enough.

Then the documentation begins to go in all directions and seems to forget to explain the obvious: once I've found the person, I probably want to see his profile page after selecting him/her. Since I've loaded PHP arrays, it's really just opening the profile page for user number X.

So my question is simple: suppose that I autocomplete to Jack Smith, and want to see his profile page by clicking the enter key, (i.e., opening, say, user_profiles.php?user_id=332), what do I have to add to the snippet?
<script type="text/javascript" src="jquery/jquery-1.3.1.min.js"></script>
<script type="text/javascript" src="jquery/jquery.bgiframe.min.js"></script>
<script type="text/javascript" src="jquery/jquery.autocomplete.pack.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$(document).ready(function() {
<p>Find by last name: <input type="text" id="last_names" /></p>
<p>Find by username: <input type="text" id="usernames" /></p>

Open in new window

Question by:CPL593H
1 Comment

Accepted Solution

ali_pakkan earned 2000 total points
ID: 23644373
So, i understand that you return the user_id from your PHP. In that case you can do (or change according to your needs):

$(document).ready(function() {
	$("input").result(function(event, data, formatted) {
		document.location.href = "user_profiles.php?user_id=" + data[0];

Open in new window


Featured Post

Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

How to build a simple, quick and effective accordion menu using just 15 lines of jQuery and 2 css classes
Nothing in an HTTP request can be trusted, including HTTP headers and form data.  A form token is a tool that can be used to guard against request forgeries (CSRF).  This article shows an improved approach to form tokens, making it more difficult to…
The viewer will learn how to look for a specific file type in a local or remote server directory using PHP.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
Suggested Courses
Course of the Month15 days, 3 hours left to enroll

839 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question