SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Evangelist CyberFuture's Avatar
    Join Date
    May 2001
    Location
    San Diego, CA
    Posts
    434
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Accessing the elements array number for a given form element

    Ok so I have a field in a form and I want to onKeyUp runs a functuns that if successfully bounces me to the next field. All was well and good until new additions via php meant the the field's location can vary. So if I can figure out the fields position in the array I could alter the the function accordingly. I also run this script multiple times in the form so I can't use field names.. or can I?

    Here's my original script where 7 was the field's location when the form was not subject to changing field numbers.
    Code:
      function jumpbox(test){
    if(document.theForm.elements[test].value.length>2){
     document.theForm.elements[test + 1].focus();
     }
    }
     
    <input type="text" name="faxArea" size="3" maxlength="3" onKeyUp="jumpbox(7)">
    Please Help!

  2. #2
    SitePoint Wizard silver trophy
    Join Date
    May 2003
    Posts
    1,843
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" 
        "http://www.w3.org/TR/html4/loose.dtd">
    
    <html>
    <head>
    <title>untitled</title>
    <script type="text/javascript">
    
    function jumpbox(el)
    {
    	if (el.value.length == el.maxLength)
    	{
    		var f = el.form,
    		l = f.elements.length
    		i = 0;
    		for (; i < l; ++i)
    			if (f.elements[i] == el)
    			{
    				if (el = f.elements[i + 1])
    					if (!/(button)|(submit)|(reset)/.test(el.type))
    						el.focus();
    				return true;
    			}
    	}
    	return true;
    }
    
    </script>
    </head>
    <body>
    <form onreset="zip.focus()">
    <input type="text" name="zip" value="" size="5" maxlength="5" onkeyup="return jumpbox(this)">___5 max<br /><br />
    <input type="text" name="foo" value="" size="8" /><br /><br />
    <input type="text" name="faxArea" value="" size="3" maxlength="3" onkeyup="return jumpbox(this)">___3 max<br /><br />
    <input type="text" name="hah" value="" size="8" /><br /><br />
    <input type="text" name="serial" value="" size="4" maxlength="4" onkeyup="return jumpbox(this)">___4 max<br /><br />
    <input type="reset" />
    </form>
    </body>
    </html>
    Behaviors that interfere with the filling out of a form are usually a pain for users (try and tab back to that field)...but, whatever.
    Last edited by adios; Sep 20, 2004 at 22:23.
    ::: certified wild guess :::

  3. #3
    SitePoint Evangelist CyberFuture's Avatar
    Join Date
    May 2001
    Location
    San Diego, CA
    Posts
    434
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks for your Reply Adios

    I woke up this morning and my path was clear. Below is the final script I'm using:
    Code:
    function jumpbox(test){
    for(var i = 0; i < document.form2.length; i++) {
     if(document.form2.elements[i].name == test){
      break;
      }
     }
    if(document.form2.elements[i].value.length>2){
     document.form2.elements[i + 1].focus();
     }
    }
     
    <input type="text" name="faxArea" size="3" maxlength="3" onKeyUp="jumpbox(this.name)">

  4. #4
    SitePoint Wizard silver trophy
    Join Date
    May 2003
    Posts
    1,843
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Terrible script. Whatever...
    ::: certified wild guess :::


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •