Mask Textbox view for a phone number

Madam Zu Zu picture Madam Zu Zu · Aug 15, 2013 · Viewed 31.6k times · Source

i am trying to format a text box so that when the users can type in a phone number and it would automatically put it in the following format :(999)999-9999

i tried using the MaskedEditExtender, it works but it does the complete opposite of what i need.

when i click on the field it shows the correct format, but once i mouse out it still only shows 9999999999

how can i do it so that the user ONLY types in numbers and it puts dashes and parentheses where it's supposed to automatically(which it does now), but keep the format when i click out of it.

<asp:TextBox ID="txtSuperPhone" runat="server" CssClass="myinputstyle"  />
    <asp:MaskedEditExtender ID="mskSuperPhone" runat="server" TargetControlID="txtSuperPhone" Mask="(999)999-9999"/>

Answer

Smeegs picture Smeegs · Aug 15, 2013

To answer your question, you have to set the "ClearMaskOnLostFocus" to false on the extender for the mask to show all the time.

That being said....

I strongly suggest that you use the jquery alternative.

http://digitalbush.com/projects/masked-input-plugin/

The reason I say this is because the maskededitextender does not work in safari.