Telerik Forums / UI for ASP.NET AJAX
This is a migrated thread and some comments may be shown as answers.

Set Dynamic Mask using RadMaskedTextBox

15 Answers 577 Views
Input
This is a migrated thread and some comments may be shown as answers.
Mohan
Top achievements
Rank 1
Mohan asked on 16 Jul 2012, 08:41 PM
Team,

Scenario : I have to assign the Mask property dynamically in Code Behind. 
Issue : Not able to type anything on the textbox field and nothing to display

IN ASPX:
<telerik:RadMaskedTextBox ID="tbHours" runat="server" SelectionOnFocus="SelectAll"                                                                                     CssClass="RadMaskedTextBox80" Height="20px"></telerik:RadMaskedTextBox>

IN C#
If (true)
{
tbHours.Text = "00.0";
tbHours.Mask = "<0..99>.<0..9>";
}
else
{
tbHours.Text = "00:00";
tbHours.Mask = "<00..23>:<00..59>"; 
}

15 Answers, 1 is accepted

Sort by
0
Princy
Top achievements
Rank 2
answered on 17 Jul 2012, 05:04 AM
Hi Mohan,

I tried to reproduce your issue in telerik version 2012, 2, 607, 40 but no avail. Please make sure that you are not getting any JavaScript error. Following is the sample code that I tried and worked as expected at my end.

ASPX:
<telerik:RadMaskedTextBox ID="tbHours" runat="server" SelectionOnFocus="SelectAll" CssClass="RadMaskedTextBox80" Height="20px">
</telerik:RadMaskedTextBox>

C#:
if (true)
 {
    tbHours.Text = "00.0";
    tbHours.Mask = "<0..99>.<0..9>";
 }
else
 {
    tbHours.Text = "00:00";
    tbHours.Mask = "<00..23>:<00..59>";
 }

Hope this helps.

Regards,
Princy.
0
Mohan
Top achievements
Rank 1
answered on 17 Jul 2012, 10:09 PM
Princy,

Thanks for the reply,

It's working fine, but when I try to get the value from the Textbox, it returns "0000" instead of "00:00".

I need the actual output as 00:00, how can i achieve this.

Regards
Mohan
0
Accepted
Princy
Top achievements
Rank 2
answered on 18 Jul 2012, 04:21 AM
Hi Mohan,

You can access the text in the RadMaskedTextBox with the literal characters in the mask using TextWithLiterals property of RadMaskedTextBox.

C#:
string text = tbHours.TextWithLiterals;

Please take a look into this documentation for more information.

Thanks,
Princy.
0
Mohan
Top achievements
Rank 1
answered on 18 Jul 2012, 11:54 AM
Princy,

One more issue is, when I use Mask like below;
ASPX:
                    <telerik:RadMaskedTextBox ID="tbScheduledTime" runat="server" CssClass="RadMaskedTextBox50"
                        Height="20px" Mask="<00..23>:<00..59>" >
                    </telerik:RadMaskedTextBox>

In the page load it display like "0:0", actually it should get display like "00:00".

For Eg:
When I type the Time 08:30, it display as "8:30", the starting zero is disabled at the time of showing. 
Expected output display should be "08:30".

Regards
Mohan

0
Princy
Top achievements
Rank 2
answered on 19 Jul 2012, 04:25 AM
Capture.PNG
Hi Mohan,

Unfortunately I couldn't replicate your issue. Following is the code that I tried which worked as expected at my end.

ASPX:
<telerik:RadMaskedTextBox ID="tbScheduledTime" runat="server" CssClass="RadMaskedTextBox50" Height="20px" Mask="<00..23>:<00..59>" >
</telerik:RadMaskedTextBox>

Attached is the screenshot.

Regards,
Princy.
0
THANGARAI
Top achievements
Rank 1
answered on 02 Dec 2013, 04:53 AM
RadMaskedTextBox.png
Hi Princy,

Please see my scenario.
I used RadMaskedTextBox for phone number field, with mask characters like  (_ _ _) _ _ _-_ _ _ _. for 10 numbers.
whenever my page is refreshing or post baking that textbox flicking with some warning image. How to hide that flicking .
please see the attachment.
Thanks in advance
0
Princy
Top achievements
Rank 2
answered on 02 Dec 2013, 05:29 AM
Hi THANGARAI,

Unfortunately I couldn't replicate the issue at my end. Please have a look into the sample code snippet which works fine at my end.

ASPX:
<asp:Label ID="Label1" runat="server" Text="Primary">
</asp:Label>
<telerik:RadMaskedTextBox ID="RadMaskedTextBox1" runat="server"  Mask="(###)###-####">
</telerik:RadMaskedTextBox>
<telerik:RadButton ID="RadButton1" runat="server" Text="PostBack">
</telerik:RadButton>

Please provide your code if it doesn't help.
Thanks,
Princy.
0
THANGARAI
Top achievements
Rank 1
answered on 02 Dec 2013, 06:04 AM
<%@ Page Language="VB" %><%@ Import Namespace="Telerik.Web.UI" %>
 
<!DOCTYPE html>
 
<script runat="server">
     
    Class RadMaskedTextBox
        Private Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs)
             
        End Sub
    End Class
</script>
 
<head runat="server">
    <title></title>
</head>
<body style="margin-left:100px; margin-top:20px;">
    <form id="form1" runat="server">
        <telerik:RadScriptManager ID="scriptMgr" runat="server"></telerik:RadScriptManager>
    <div><asp:UpdatePanel ID="upp" runat="server"><ContentTemplate>
    Feild1<telerik:RadMaskedTextBox   ID="RadMaskedTextBox1" PromptChar="_ "  TabIndex="17" runat="server" Mask="(###) ###-####" SelectionOnFocus="CaretToBeginning" width="160px"></telerik:RadMaskedTextBox>
    <br /><br /> Feild2<telerik:RadMaskedTextBox  ID="RadMaskedTextBox2" PromptChar="_ "  TabIndex="17" runat="server" Mask="(###) ###-####" SelectionOnFocus="CaretToBeginning" width="160px"></telerik:RadMaskedTextBox>
    <br /><br /> Feild3<telerik:RadMaskedTextBox  ID="RadMaskedTextBox3" PromptChar="_ "  TabIndex="17" runat="server" Mask="(###) ###-####" SelectionOnFocus="CaretToBeginning" width="160px"></telerik:RadMaskedTextBox>
    <br /><br />  <asp:Button ID="Button1" runat="server" Text="Click Here" />
        </ContentTemplate></asp:UpdatePanel>
    </div>
    </form>
</body>
</html>


Hi Princy,
Please check my code. 
The textbox is flicking when it is empty.
0
Princy
Top achievements
Rank 2
answered on 02 Dec 2013, 06:42 AM
Hi THANGARAI,

The PromptChar property is used to set a character to indicate that the user input is required at a specific location in the input mask. This property will only accept a single character. If an attempt is made to assign a multi-character string to it, an error will occur. Please try to remove the space in the PromptChar property of RadMaskedTextBox.

ASPX:
<asp:UpdatePanel ID="upp" runat="server">
    <ContentTemplate>
        Feild1<telerik:RadMaskedTextBox ID="RadMaskedTextBox1" TabIndex="17" runat="server"
            Mask="(###) ###-####" PromptChar="_" SelectionOnFocus="CaretToBeginning" Width="160px">
        </telerik:RadMaskedTextBox>
        <br />
        <br />
        Feild2<telerik:RadMaskedTextBox ID="RadMaskedTextBox2" PromptChar="_" TabIndex="17"
            runat="server" Mask="(###) ###-####" SelectionOnFocus="CaretToBeginning" Width="160px">
        </telerik:RadMaskedTextBox>
        <br />
        <br />
        Feild3<telerik:RadMaskedTextBox ID="RadMaskedTextBox3" PromptChar="_" TabIndex="17"
            runat="server" Mask="(###) ###-####" SelectionOnFocus="CaretToBeginning" Width="160px">
        </telerik:RadMaskedTextBox>
        <br />
        <br />
        <asp:Button ID="Button1" runat="server" Text="Click Here" />
    </ContentTemplate>
</asp:UpdatePanel>

Thanks,
Princy.


0
THANGARAI
Top achievements
Rank 1
answered on 02 Dec 2013, 09:13 AM
Hi Princy,
Thanks for your reply . Its works superb.
If I remove the space in PromptChar peroperty (ie PromptChar ="_"),
the textbox is displaying like (___)___-____ . But we need to show the phone number format to the users like (_ _ _)_ _ _-_ _ _ _ .
Is there any possibilities to achieve my scenario.?
0
Princy
Top achievements
Rank 2
answered on 03 Dec 2013, 03:58 AM
Hi THANGARAI,

Please try to set the DisplayMask property of RadNumericTextBox to display the text . Please have a look into the following code snippet.

ASPX:
<asp:UpdatePanel ID="upp" runat="server">
    <ContentTemplate>
        Feild1<telerik:RadMaskedTextBox ID="RadMaskedTextBox1" TabIndex="17" runat="server"
            Mask="(###) ###-####" DisplayMask="(_ _ _)_ _ _ -_ _ _ _" SelectionOnFocus="CaretToBeginning"
            Width="160px">
        </telerik:RadMaskedTextBox>
        <br />
        <br />
        Feild2<telerik:RadMaskedTextBox ID="RadMaskedTextBox2" PromptChar="_" TabIndex="17"
            runat="server" Mask="(###) ###-####" DisplayMask="(_ _ _)_ _ _ -_ _ _ _" SelectionOnFocus="CaretToBeginning"
            Width="160px">
        </telerik:RadMaskedTextBox>
        <br />
        <br />
        Feild3<telerik:RadMaskedTextBox ID="RadMaskedTextBox3" PromptChar="_" TabIndex="17"
            runat="server" Mask="(###) ###-####" DisplayMask="(_ _ _)_ _ _ -_ _ _ _" SelectionOnFocus="CaretToBeginning"
            Width="160px">
        </telerik:RadMaskedTextBox>
        <br />
        <br />
        <asp:Button ID="Button1" runat="server" Text="Click Here" />
    </ContentTemplate>
</asp:UpdatePanel>

Thanks,
Princy.
0
Jay
Top achievements
Rank 1
answered on 03 Jan 2014, 06:55 AM

Hi I am facing the same problem, I get error notifications in radMaskedTextBox for every button click and its frustrating us.

After using the following code I get other problems, when I place the cursor in the text box all the spaces given in the display mask is removed and after entering the numbers. the numbers which I entered is hidden on blur.

<telerik:RadMaskedTextBox ID="RadMaskedTextBox1" TabIndex="17" runat="server"

            Mask="(###) ###-####" DisplayMask="(_ _ _)_ _ _ -_ _ _ _" SelectionOnFocus="CaretToBeginning"
            Width="160px">
        </telerik:RadMaskedTextBox>

Please give me a correct solution.

We have to show the format like this "(_ _ _)_ _ _ -_ _ _ _".  It should work in such a way that as given promptchar="_ " and at the same time the radMaskedtextbox should not show error notification on post back.

Thanks & regards

JayRam

0
Princy
Top achievements
Rank 2
answered on 03 Jan 2014, 08:29 AM
Hi Jay,

Please have a look into the following code snippet which works fine at my end.

ASPX:
<telerik:RadMaskedTextBox ID="RadMaskedTextBox1" TabIndex="17" runat="server"
    PromptChar="_" Mask="(# # #)# # #-# # # #" SelectionOnFocus="CaretToBeginning"
    Width="160px">
</telerik:RadMaskedTextBox>

Thanks,
Princy.
0
Jay
Top achievements
Rank 1
answered on 03 Jan 2014, 08:44 AM
Thanks for the reply Princy, I have already tried with this but I don't want the letter space after entering the phone number.
0
Vasil
Telerik team
answered on 07 Jan 2014, 11:32 AM
Hi Jay,

If I understand you correct, you want mask without spaces and display mask with spaces. This code is working on my side with no problem.

<telerik:RadMaskedTextBox ID="RadMaskedTextBox1" runat="server"
    PromptChar="_"
    Mask="(###)###-####"
    DisplayMask="(# # #) # # # - # # # #"
    SelectionOnFocus="CaretToBeginning">
</telerik:RadMaskedTextBox>

Regards,
Vasil
Telerik
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 the blog feed now.
Tags
Input
Asked by
Mohan
Top achievements
Rank 1
Answers by
Princy
Top achievements
Rank 2
Mohan
Top achievements
Rank 1
THANGARAI
Top achievements
Rank 1
Jay
Top achievements
Rank 1
Vasil
Telerik team
Share this question
or