[Javascript] Javascript or ASP.Net - Input Mask for Text Box thenAuto Tab

Mon Mar 24 14:24:11 CST 2003

Dave, 

I was just telling Chris that it did work for me (partially) when he posted that it didn't work for him.  

I have a similar example that was written specifically for IE but does sort of the same thing.  Mine has a function assigned to the onkeypress event to kill the event if the keyCode is not a number to prevent bogus characters being typed in.  Then another function adds the dashes on the onkeyup event.  I added my validateNumKey and the onkeypress event handler to your example and it would tell me that the 2 on the numeric pad was 50 but the alert in your isPhone would report it as 98.  The 98 then gets translated as a 'b' and that is probably why the alert is being fired.

My function that handles the onkeyup doesn't deal with the event (but I did test it and it also gets 98 for the 2 on the numeric pad where it gets 50 in the validateNumKey function).

Anyway, here are my two functions.  There is a text control that assigns the validateNumKey function to the onkeypress event and the addDashes2 function to the onkeyup event.  I also have another function assigned to the onblur event to make sure the dashes are there (that is to handle the case where the value is Ctrl+V or mouse click pasted into the field).  In this case, the input text is named date and is in a form named form1.

<INPUT TYPE=TEXT id=date onkeyUp="addDashes2()" onkeypress="validateNumKey()" onblur="addDashes();" MAXLENGTH=10>

function validateNumKey ()
{
 var inputKey =  event.keyCode;
 var returnCode = true;

 if ( inputKey > 47 && inputKey < 58 ) // numbers
 {
  return;
 }
 else
 {
  returnCode = false;
  event.keyCode = 0;
 }
 event.returnValue = returnCode;
}

function addDashes2()
{
 var currValue = document.forms["form1"].date.value;
 var a = currValue.split ("/").join("");

 if ( a.length > 3 )
  document.forms["form1"].date.value = a.substr(0,2) + "/" + a.substr(2,2) + "/" + a.substr(4);
 else
  if ( a.length > 1 )
   document.forms["form1"].date.value = a.substr(0,2) + "/" + a.substr(2)

 //if ( a.length == 10 )
 // tab to your next field
}

-----Original Message-----
From: David Lovering [mailto:dlovering at gazos.com]
Sent: Monday, March 24, 2003 01:35 PM
To: [JavaScript List]
Subject: Re: [Javascript] Javascript or ASP.Net - Input Mask for Text Box thenAuto Tab

No, this was a simple demo on an old keyboard.  The key event masks are different for the number keys above the main keyboard than they are for the number pad, but the conditionals could be easily extended to cover even them.  I could probably gen something together that would recognize the number pad, ... if only I had a keyboard WITH a number pad!
[The reason I probably don't has something to do with the fact that different manufacturers use different ROMs in their keyboards, and hence generate slightly different key events.]

I could also modify the script to use a 'watch("keyUp",...) trap instead of an event handler, which should make it generic enough to use both the regular number keys and the number pad keys.  

Is this enough of a hint, or do you want me to tweak the code a bit?

-- Dave Lovering

----- Original Message ----- 
From: Mckinney, Lori  <mailto:lkmckinn at ingr.com> K 
To: [JavaScript List] <mailto:javascript at LaTech.edu>  
Sent: Monday, March 24, 2003 12:23 PM
Subject: RE: [Javascript] Javascript or ASP.Net - Input Mask for Text Box thenAuto Tab

Are you using the number pad?  I get errors there but not with the number keys.

-----Original Message-----
From: Chris Tifer [mailto:christ at saeweb.com]
Sent: Monday, March 24, 2003 01:21 PM
To: [JavaScript List]
Subject: Re: [Javascript] Javascript or ASP.Net - Input Mask for Text Box thenAuto Tab

I just tested this and it alerts me every time I try to press a key. What's allowed with this script?

----- Original Message ----- 
From: David  <mailto:dlovering at gazos.com> Lovering 
To: [JavaScript List] <mailto:javascript at LaTech.edu>  
Sent: Monday, March 24, 2003 2:14 PM
Subject: Re: [Javascript] Javascript or ASP.Net - Input Mask for Text Box thenAuto Tab

A piece of cake.  I did a similar "dynamic filter" for phone numbers and toll-free numbers a while back, and I'm enclosing the code I did it with.  If you speak 'reg-ex' the masks themselves should be self-explanatory, and if not, drop me a line and we'll over it in detail.  [The thing is semi-customized for IE6+, but it wouldn't take much to make it viable under Netscape].

-- Dave Lovering
-- dlovering at gazos.com <mailto:dlovering at gazos.com> 

----- Original Message ----- 
From: Binkley, Tammi <mailto:binklt at sosmail.state.mo.us>  
To: 'javascript at LaTech.edu' <mailto:'javascript at LaTech.edu'>  
Sent: Monday, March 24, 2003 10:46 AM
Subject: [Javascript] Javascript or ASP.Net - Input Mask for Text Box then Auto Tab

Using ASP.Net, I'm trying to add an input mask to several Text Boxes which are date fields.  We want the date to appear "mm/dd/yyyy" in which the user would only enter the actual numbers and the input mask would insert the "/".  Once this is achieved the function should auto tab to the next field.  I actually have a function for the auto tab which works perfectly for ASP.Net, I am however, having a hard time figuring out how to insert the "/" into the field.  Any suggestions?

Tammi Binkley 
Information Technology 
Missouri Secretary of State Office 
600 West Main Street 
Jefferson City, MO 65101 
573-526-1242 
binklt at sosmail.state.mo.us 

  _____  

_______________________________________________
Javascript mailing list
Javascript at LaTech.edu
https://lists.LaTech.edu/mailman/listinfo/javascript

  _____  

_______________________________________________
Javascript mailing list
Javascript at LaTech.edu
https://lists.LaTech.edu/mailman/listinfo/javascript

  _____  

_______________________________________________
Javascript mailing list
Javascript at LaTech.edu
https://lists.LaTech.edu/mailman/listinfo/javascript

-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.evolt.org/pipermail/javascript/attachments/20030324/d357d5c2/attachment.htm>