By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
459,461 Members | 1,135 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 459,461 IT Pros & Developers. It's quick & easy.

Tab to next textbox after max length value is reached. Error in Firefox

P: 19
Hi Everyone,

I have an ASP.Net 2.0 C# web application that requires a user to enter in two sets of numbers. The first number is broken into 4 textboxes and the second number is broken into 2 textboxes.

The first number 4 textboxes have their max length property set to: 3, 4, 4, 3.
The second number 2 textboxes have their max length property set to: 4, 4.

The code I have works fine in IE, but does not work in Firefox. I was hoping someone can help point me in the right direction to enable my code to be cross-platform compatible. Thanks in advance and here is my code:

Expand|Select|Wrap|Line Numbers
  1. <script language="javascript" type="text/javascript">     
  2.         ns4 = (document.layers)? true:false;
  3.         ie4 = (document.all)? true:false;
  4.         if (ns4)
  5.            document.captureEvents(Event.KEYUP);
  6.  
  7.         document.onkeyup = checkLength;
  8.  
  9.         function checkLength(e)
  10.         {
  11.            if (ns4)
  12.            {
  13.               var key = e.which
  14.               var el = e.target;
  15.               var str = String(e.target);
  16.               str = str.toLowerCase();
  17.               if (str.indexOf('input') != -1)
  18.                  el.tagName = "INPUT"
  19.               else
  20.                  return;
  21.  
  22.               str = str.slice(str.indexOf('maxlength'));
  23.               str = str.slice(str.indexOf('=') + 1);
  24.  
  25.               if ((!isNaN(parseInt(str))) && (parseInt(str) != -1)) 
  26.                    el.maxLength = parseInt(str);
  27.               else 
  28.                  el.maxLength = 2147483647;
  29.            }
  30.            else
  31.            {
  32.               var key = event.keyCode;
  33.               var el = event.srcElement;
  34.            }
  35.  
  36.            if (el.tagName == "INPUT" && key != 8)
  37.            {
  38.               if (el.value.length + 1 > el.maxLength) 
  39.               {
  40.                    var i;
  41.                  for(i = 0; i < el.form.elements.length; i++)
  42.                  {
  43.                       if (el == el.form.elements[i])
  44.                            break;
  45.                  }
  46.  
  47.                  //if there is one, put the focus on the next element
  48.                  if (i != el.form.elements.length - 1)
  49.                  {
  50.                       if (el.form.elements[i + 1].type != "hidden") 
  51.                          el.form.elements[i + 1].focus();
  52.                  }
  53.                  else 
  54.                  {
  55.                       for(i = 0; i < el.form.elements.length; i++)
  56.                       {
  57.                          if (el.form.elements[i].type != "hidden") 
  58.                          {
  59.                             el.form.elements[i].focus();
  60.                             break;
  61.                          }
  62.                       }
  63.                  }
  64.               }
  65.            }
  66.         }
  67. </script>
Nov 28 '07 #1
Share this Question
Share on Google+
3 Replies


acoder
Expert Mod 15k+
P: 16,027
Welcome to TSDN!

Argh! This is very old IE4/NS4 browser branching code.

Instead of using browser detection, test for the object, e.g. if (e) { ...

See this example.
Nov 28 '07 #2

P: 19
The example you provided worked perfectly. Thank you so much for you help!
Nov 28 '07 #3

acoder
Expert Mod 15k+
P: 16,027
No problem, glad it helped. Post again if you have more questions.
Nov 29 '07 #4

Post your reply

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