Solved

onfocus in AJAX

Posted on 2009-05-18
7
522 Views
Last Modified: 2013-12-12
We have a form with AJAX autosuggest facility.

What we want to do is that once we select an item in an autosuggest field, the cursor should automatically move to the next field, so as to save time of the user. Is that possible? If yes, how?  
0
Comment
Question by:designmantras
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
  • 2
7 Comments
 
LVL 19

Expert Comment

by:moagrius
ID: 24413128
Yes.  Exactly how depends on the nature of the element handling the autosuggest functionality.  Just use the element.focus() method when the user accepts the suggestion, where "element" is a reference to the next element on the form you want to pass focus to.
0
 
LVL 1

Author Comment

by:designmantras
ID: 24428825
Please give me a example of AJAX autosuggest facility.
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 24428984
0
 
LVL 1

Author Comment

by:designmantras
ID: 24429189
What we want to do is that once we select an item in an autosuggest field, the cursor should automatically move to the next field, so as to save time of the user. Is that possible? If yes, how?  please give me a example..
0
 
LVL 75

Accepted Solution

by:
Michel Plungjan earned 500 total points
ID: 24429321
http://wiki.github.com/madrobby/scriptaculous/ajax-autocompleter

afterUpdateElement                   null                   
Hook for a custom function that's called following the execution of the built-in function that adds the list item text to the input field, which happens after a user has selected an entry. (The difference between updateElement and afterUpdateElement is that updateElement replaces the built-in Autocompleter function; afterUpdateElement supplements that built-in function.) The function receives two parameters, the input field specified for autocompletion, and the selected item (the <li> item selected)



new Ajax.Autocompleter("autocomplete", "autocomplete_choices", "/url/on/server", {
  afterUpdateElement : focusNext
});
 
var idOfFieldAfterAutoComplete = "field2";
function focusNext() {
    document.getElementById(idOfFieldAfterAutoComplete).focus();
}

Open in new window

0

Featured Post

[Webinar] Code, Load, and Grow

Managing multiple websites, servers, applications, and security on a daily basis? Join us for a webinar on May 25th to learn how to simplify administration and management of virtual hosts for IT admins, create a secure environment, and deploy code more effectively and frequently.

Question has a verified solution.

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

OverviewThis article demonstrates a simple search form using AJAX. The purpose of the article is to demonstrate how to use the same code to render a page and javascript (JQuery) and AJAX to make subsequent calls to refine the results. The princip…
Introduction This article is intended for those who are new to PHP error handling (https://www.experts-exchange.com/articles/11769/And-by-the-way-I-am-New-to-PHP.html).  It addresses one of the most common problems that plague beginning PHP develop…
Learn how to match and substitute tagged data using PHP regular expressions. Demonstrated on Windows 7, but also applies to other operating systems. Demonstrated technique applies to PHP (all versions) and Firefox, but very similar techniques will w…
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…

738 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