Faqts : Computers : Programming : Languages : JavaScript : Forms : TextAreas/TextFields

+ Search
Add Entry AlertManage Folder Edit Entry Add page to http://del.icio.us/
Did You Find This Entry Useful?

28 of 68 people (41%) answered Yes
Recently 3 of 10 people (30%) answered Yes

Entry

How can I provide a mask for an INPUT field which is autocompleted while the user types?

Jan 25th, 2001 07:29
Martin Honnen,


IE4+ on those platforms where the range objects exists (Win32 at least) 
allows that; here is an example which provides a date
  YYYY-MM-DD
mask, which is selected when the user focusses on the field and then 
autocompleted and selected when the user types in text:
<HTML>
<HEAD>
</HEAD>
<BODY>
<FORM NAME="formName">
<INPUT TYPE="text" 
       NAME="date" 
       VALUE="YYYY-MM-DD"
       SIZE="10" STYLE="font-family: 'Courier New';"
       ONFOCUS="this.select(); 
                this.oldValue = this.value;"
       ONKEYUP="var n = this.value.length;
                this.value = this.value + this.oldValue.substring(n);
                var range = this.createTextRange();
                range.moveStart('character', n);
                range.select();
                this.oldValue = this.value;"
>
</FORM>
</BODY>
</HTML>