RadMaskedTextBox: reformat contents after entry possible?

4 posts, 0 answers
  1. Matt Dunphy
    Matt Dunphy avatar
    2 posts
    Member since:
    May 2010

    Posted 22 Feb 2012 Link to this post

    Greetings. I know that there are various javascript stunts available to get the kind of functionality I'm about to describe to happen, and I've had to implement some to get this functionality already. But I'm here asking if I just overlooked something in RadMaskedTextBox.

    The functionality is this: Let's say I have a text box for entering SSN. What my client wants to have happen is for the box to look plain, no displayed masking of dashes or prompts when empty. He wants the cursor to always start at the leftmost character when the box is truly empty and it gets the focus.

    When typing, he wants the input to be restricted to only numbers, period. But then, after the field is exited, he wants the field to magically reformat itself for display with the masking dashes. So I typed 012345678, and it looks like that while I'm in the box and typing, but on blur, it turns into 012-34-5678. Similarly if I re-entered the box it would go back to 012345678 during the edit.

    Notably, the guy is asking this because of the way that he perceives RadDateInput to work, in the way that you can enter different date formats and it'll reformat it like magic on exit. I can't really blame him for not knowing this is an apples/oranges kind of a deal.

    RadMaskedTextBox seems just millimeters away from this, but I can't quite get it to happen in the way the client wants. I can't get it to not show the masking dashes when it's empty or during typing, and a couple of other minor matters that to the client are a deal-breaker and I'm off in custom javascript land to solve it.

    Am I just missing something? If so, that'd be great, as they're wanting this kind of functionality for phone numbers, too, where it would magically materialize (123)456-7890 out of 1234567890 in the same exact way.
  2. Vasil
    Admin
    Vasil avatar
    1547 posts

    Posted 24 Feb 2012 Link to this post

    Hello Matt,

    You could set different Mask and DisplayMask for the RadMaskedTextBox:

    <telerik:RadMaskedTextBox runat="server" Mask="##########" DisplayMask="###-###-####" DisplayPromptChar=" " PromptChar=" "></telerik:RadMaskedTextBox>

    When the textbox is in focus the value will be seen depending on the Mask, and when it blurs it will be reformatted using the DIsplayMask.

    All the best,
    Vasil
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Matt Dunphy
    Matt Dunphy avatar
    2 posts
    Member since:
    May 2010

    Posted 24 Feb 2012 Link to this post

    Yes, and I've been trying things like that all along. But note the very first requirement I stated: What my client wants to have happen is for the box to look plain, no displayed masking of dashes or prompts when empty.
    Your solution still shows the masking dashes when it's empty.
    Truly, if it wasn't for the client insisting on that one bit, I wouldn't even be here posting. But you know clients. They're like that.
  5. Vasil
    Admin
    Vasil avatar
    1547 posts

    Posted 27 Feb 2012 Link to this post

    Hello,

    Set EmptyMessage=" "  to your RadMaskedTextBox, and the input will be truly empty when there is no entered value.

    Kind regards,
    Vasil
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Back to Top