473,795 Members | 3,081 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

JavaScript For Automatically moving Between Textboxes

Frinavale
9,735 Recognized Expert Moderator Expert
Hi there!

I'm trying to write a simple JavaScript that will move the cursor to the next TextBox after 5 characters (or numbers) have been entered. I'm attempting to get this working in all browsers and realize that I'll likely have to write more than one script depending on which the user is using.

Anyways, everything I've tried...I've only come up with something that "sort of" works in IE (only).
The cursor will be moved to the next TextBox when the count reaches 5 but the 5th character is not printed because it's being replaced by the tab event (keyCode=9).

This will not work for FireFox, nor Opera. I've changed "keyCode" to be "charCode". ... Alas, it will not tab to the next TextBox...it just prints a space instead.

So, after attempting this solution I tried to use the focus() method instead.

I have no idea why, but this won't work in any browser.

Does anyone have a suggestions on how to go about solving this problem?

I'm pretty stuck.

Thanks :)

-Frinny
Apr 2 '07 #1
2 4990
mrhoo
428 Contributor
Why limit yourself to 5?
This script will advance the focus from any input with a maxLength property when the number of digits or characters equals the maxlength.
Expand|Select|Wrap|Line Numbers
  1. <html>
  2. <head>
  3. <title>Moving Focus</title>
  4.  
  5. <script type="text/javascript">
  6.  
  7. function after5(e){
  8.     var who= e? e.target: event.srcElement;    
  9.     if(who.value.length< who.maxLength) return true;    
  10.     var group= who.form.elements;
  11.  
  12.     var L= group.length-1, tem;
  13.     for(var i=0; i<L; i++){
  14.         tem= group[i];
  15.         if(tem==who && group[i+1]) return group[++i].focus();
  16.     }
  17. }
  18. onload= function(){
  19.     var A=document.getElementsByTagName('input');
  20.     var L= A.length;    
  21.     for(var i=0; i< L; i++){
  22.         var tem=A[i];
  23.         if(tem.maxLength)tem.onkeyup= after5;    
  24.     }
  25.     A[0].focus();
  26. }
  27. </script>
  28. </head>
  29. <body> 
  30. <h1>Moving focus</h1>
  31. <form action='' onsubmit="return false;">
  32. <p><label>First box: 5 characters <input name="in_1" type="text" size="5" maxLength="5" value=""></label></p>
  33. <p><label>Second box: 5 characters <input name="in_2" type="text" size="5" maxLength="5" value=""></label></p>
  34. <p><label>Third box: 3 characters <input name="in_3" type="text" size="3" maxLength="3" value=""></label></p>
  35. <p><label>Fourth box: 7 characters <input name="in_4" type="text" size="7" maxLength="7" value=""></label></p>
  36. <p><label>Fifth box: 5 characters <input name="in_5" type="text" size="5" maxLength="5" value=""></label></p>
  37. <p><input type="button" value="Submit"></p>
  38. </form>
  39. </body>
  40. </html>
  41.  
Apr 2 '07 #2
Frinavale
9,735 Recognized Expert Moderator Expert
Why limit yourself to 5?
This script will advance the focus from any input with a maxLength property when the number of digits or characters equals the maxlength.
...
Mr. Hoo you are Awesomel!

Thank you so much!
I never even thought about using the max length.
I ended up finally getting the focus() to change to the next textbox (had a case sensitive issue with my getElementByID( ) )...

But then ran into a few problems for when the user's input was something like backspace...and even had to write code to check how many characters were in the fields if the focus had changed.

The max length check gets rid of both these problems completely!
This is such a complete solution to my problem.
I hope you don't mind me using it as is.

Thanks again!
:)
-Frinny
Apr 2 '07 #3

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

Similar topics

53
5748
by: Cardman | last post by:
Greetings, I am trying to solve a problem that has been inflicting my self created Order Forms for a long time, where the problem is that as I cannot reproduce this error myself, then it is difficult to know what is going on. One of these Order Forms you can see here... http://www.cardman.co.uk/orderform.php3
3
4766
by: Peter Williams | last post by:
Hi All, I want to write some javascript for a html page which does the following. Imagine that the page contains a table with 2 columns and 3 rows, e.g.: +---+---+ | A | B | +---+---+
0
1269
by: sramruttun | last post by:
hi I have 2 textboxes for entry of start and end dates. I allow typing in the textboxes also. I have 2 compareValidator fields as well to validate the 2 textboxes which work fine. Upon text change (onchange event) of the textboxes, I have written a javascript function (called formatDate) to format the date - that is, if the date is in format 1/1/2003, the function will format it to 01/01/2003. Normally, when the textboxes lose focus,...
4
2622
by: Davisro | last post by:
I would like to have a total box show the totol of four textboxes when anyone of them change. I know I could do this via postback, but would like to do this on client side utilizing javascript. I am familiar with asp.net but not in how to migrate javascript into the html. Thanks,
2
3686
by: Luis Esteban Valencia Muñoz | last post by:
I have a datagrid that displays editable text fields (2 different price fields) and a checkbox in every row. It has a "SaveChanges" button at the bottom, which, when pressed, looks at every checkbox in the datagrid, if it is checked, it updates the corresponding rows prices. That works, no problem. What I need to do is that when a user clicks into either of the price text fields, the checkbox automatically checks itself. This will save...
1
8421
by: Sirisha | last post by:
Hi, I want javascript for displaying multiple textboxes dynamically. ADD-this is button. if i click button first time it will display 1 textbox and if i click 2nd time it will display another textbox,if i click that button once again display another textbox.if i click 10 times it will display 10 textboxes. so i want code for displaying textboxes dynamically using javascript.
1
2478
by: =?Utf-8?B?UmljaA==?= | last post by:
In a database search application (vb2005), the user wants to be able to scroll through records using the mousewheel. The data display form contains textboxes for the main data and a datagridview for the detail data for each main record. The form also contains btnBegining, btnPrevious, btnNext, btnEnd. In the btnNext.MouseWheel event I can increment/decrement the main data currencymanager position of the main dataset (depending on...
2
2468
by: davidson1 | last post by:
Hai friends..for menu to use in my website..i found in one website....pl look below website.... http://www.dynamicdrive.com/dynamicindex1/omnislide/index.htm i downloaded 2 files.... menuitems.js mmenu.js
0
1824
by: =?Utf-8?B?QWJoaQ==?= | last post by:
Hi All, i have 3 textboxes for area Code,phone number and Extention and each have MaskedEditExtender associated with it. i want that when the length of first text box reaches it's maxlength , focus will be set to next textbox automatically, means i want auto tabbed fields. for which i created java script function and associated it with OnKeyDown and OnKeyUp event of TextBox. but it's not working and when i remove the...
0
9672
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However, people are often confused as to whether an ONU can Work As a Router. In this blog post, we’ll explore What is ONU, What Is Router, ONU & Router’s main usage, and What is the difference between ONU and Router. Let’s take a closer look ! Part I. Meaning of...
0
9519
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 effortlessly switch the default language on Windows 10 without reinstalling. I'll walk you through it. First, let's disable language synchronization. With a Microsoft account, language settings sync across devices. To prevent any complications,...
0
10439
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, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed. This is as boiled down as I can make it. Here is my compilation command: g++-12 -std=c++20 -Wnarrowing bit_field.cpp Here is the code in...
0
9043
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own.... Now, this would greatly impact the work of software developers. The idea...
0
6783
by: conductexam | last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one. At the time of converting from word file to html my equations which are in the word document file was convert into image. Globals.ThisAddIn.Application.ActiveDocument.Select();...
0
5437
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 last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in the same network. But I'm wondering if it's possible to do the same thing, with 2 Pfsense firewalls...
1
4113
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 we have to send another system
2
3727
muto222
by: muto222 | last post by:
How can i add a mobile payment intergratation into php mysql website.
3
2920
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 can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating effective websites that not only look great but also perform exceptionally well. In this comprehensive...

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.