Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    New to the CF scene
    Join Date
    May 2007
    Location
    Phil
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts

    tab key emulation

    hi, i've been using this function to make the enter key behave like a tab key. this way, the user can go to the next field of the form by pressing the enter key. problem is, how can i determine if the next field is a submit button? in this case, the enter key must not emulate the tab key. can anyone pls help me revise the code below? thanks a lot.


    function enterToTab(formRef, focusAny)
    {
    /***(C)'Arty Effem'
    In all text/password elements of the specifed form, plus /empty/ textareas,
    Enter key 'tabs' to:
    focusAny==true: next visible element,
    focusAny==false: next text/textarea/pw
    ***/
    for(var i=0, e=formRef.elements, len=e.length, hasNext=true; i<len && hasNext; i++)
    if( e[i].type && /^text|password|file/.test( e[i].type ) )
    {
    for(var j=i+1; j<len && (!e[j].type ||( focusAny ? /hidden/.test(e[j].type): !/^text|password|file/.test(e[j].type)) ); j++)
    ;
    hasNext = j!=len;

    e[i].onkeypress=new Function("var ta=false,k=(arguments[0]?arguments[0].which:window.event.keyCode )!=13;\
    if(!k && !(ta=(this.type=='textarea'&&this.value.length>0)) && "+hasNext+")this.form.elements["+(j)+"].focus(); return k||ta;");
    }

    }

  • #2
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,642
    Thanks
    0
    Thanked 649 Times in 639 Posts
    e[i].type = 'submit' or possibly 'button'
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • #3
    Banned
    Join Date
    May 2006
    Location
    England
    Posts
    664
    Thanks
    0
    Thanked 84 Times in 84 Posts
    Quote Originally Posted by tram View Post
    hi, i've been using this function to make the enter key behave like a tab key. this way, the user can go to the next field of the form by pressing the enter key. problem is, how can i determine if the next field is a submit button? in this case, the enter key must not emulate the tab key. can anyone pls help me revise the code below? thanks a lot.
    This revision will not focus Submit or Reset buttons:
    Code:
    function enterToTab(formRef, focusAny) 
    {
     /***(C)'Arty Effem'
     In all text/password elements of the specifed form, plus /empty/ textareas,
     Enter key 'tabs' to:
     focusAny==true: next visible element,
     focusAny==false: next text/textarea/pw
     ***/  
     for(var i=0, e=formRef.elements, len=e.length, hasNext=true; i<len && hasNext; i++)
      if( e[i].type && /^text|password|file/.test( e[i].type ) )
      {
       for(var j=i+1; j<len &&  (!e[j].type||/submit|reset/.test(e[j].type)||( focusAny ? /hidden/.test(e[j].type): !/^text|password|file/.test(e[j].type)) ); j++)
       ;
       hasNext = j!=len;
       
       e[i].onkeypress=new Function("var ta=false,k=(arguments[0]?arguments[0].which:window.event.keyCode )!=13;\
       if(!k && !(ta=(this.type=='textarea'&&this.value.length>0)) && "+hasNext+")this.form.elements["+(j)+"].focus(); return k||ta;");
      }  
    }

  • #4
    New to the CF scene
    Join Date
    May 2007
    Location
    Phil
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts
    felgall & Arty Effem, thanks for the help. anyway, i revised the code such that when it reaches the submit button, the enter key will not emulate the tab key but rather submit the form. here's the revised code


    function enterToTab(formRef, focusAny)
    {

    for(var i=0, e=formRef.elements, len=e.length, hasNext=true; i<len && hasNext; i++)
    if( e[i].type && /^text|password|file|radio|select/.test( e[i].type ) )
    {
    for(var j=i+1; j<len && (!e[j].type ||( focusAny ? /hidden/.test(e[j].type): !/^text|password|file|radio|select/.test(e[j].type)) ); j++)
    ;
    hasNext = j!=len;


    e[i].onkeypress=new Function("var ta=false,k=(arguments[0]?arguments[0].which:window.event.keyCode )!=13;\
    if(!k && !(ta=(this.type=='submit')))this.form.elements["+(j)+"].focus(); return k||ta;");

    }
    }

  • #5
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    Well, hm... I would not have changed the behavior of the "classic" keys... All the users know what TAB suppose to do, and you will confuse them...
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #6
    New to the CF scene
    Join Date
    May 2007
    Location
    Phil
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts
    well, it's not the TAB's behavior that i am altering but the Enter key. doing this mechanism would somehow prevent the user from submitting the incomplete form when he accidentally clicks the enter key. the program that i'm doing doesn't allow any editing so once the user submits his form it's assumed to be final.


  •  

    Posting Permissions

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