RadMaskedTextBox question / issue on a web site

[Paul Beaulieu]

I am using a masked text box to allow my users to enter text that also has literal text in the box for example the text box has a the literal text of "My name is : " and I want the user to enter text of a date.  Since every name is a different length  I added the small loop below.  Have not had anybody need more space.  I also set the RadMaskedTextBox to always selectAll when the field is entered.

 For i As Integer = 1 To 40
         radusertext.MaskParts.Add(New Telerik.Web.UI.FreeMaskPart())
 Next           
radusertext.SelectionOnFocus = SelectionOnFocus.SelectAll

 

Here are the issues I am having

1) The FreeMaskPart does not show any mask space holders.  This is good for the most part. when the user first enters the box and types there name all is good.  For example they enter the name "Paul"
2)  If the user leaves the text box and then re-enters it all text is selected.  The issue keeps coming where the user enters the textbox then clicks to the last char in this example the "l".  The reality is they clicked the end but they are not on the "l" they are at the end of the mask or in this example 36 charectors past the "l" 40 char of the mask - 4 char in "paul".  If they hit the backspace or the left arrow key it appears that nothing is happening even though they are moving back along the mask.   As stated in "1" above the "FreeMaskPart" option does not show any actual mask chars.

So what I need to be able to do is this:
1) not limit the mask to 40 chars but make is any lenght
2) when they re-enter the masked box and click the end of the box not have to hit the backspace or left arrow key 36 times from the example above 
3) least favorite option show an underline for the masked character. When using "New Telerik.Web.UI.FreeMaskPart()" there is no masked text indication so they at least see where the cursor is in the box

 

Any help on this would be greatly appreciated

Thanks
Paul

[Doncho]

Hi Paul,

I have sent an answer to the formal support you have opened on the same topic.

I would suggest proceeding with the communication there only.

For transparency I am pasting my answer here as well:

Straight to the questions:

How to:

1) not limit the mask to 40 chars

I am afraid that there is no straightforward way to achieve this with RadMaskedTextBox.

Each MaskPart() is a separate object that needs initialization on the server which will require certain time and memory. Furthermore, with the rendering of the RadMaskedTextBox, each MaskPart is processed as a character (PromptChar/DisplayPromptChar - "_" by default) in multiple places in the Rendered DOM hence the size of the requests will increase significantly if too many MaskParts are defined:

2) when they enter the masked box and click the end of the box not have to hit the backspace or left arrow key 36 times from the example above 

Unfortunately, this is how the control is designed to work. Each MaskPart is a real symbol in the rendered input, hence it cannot be skipped.

You can possibly use the keyDown event of the <input> element rendered by the MaskedBox to apply some custom logic that moves the cursor position conditionally:

<script>
    function inputKeyDown(ev, sender) {
        if (ev.keyCode == 8) { //backspace pressed
            //custom logic here
        }
    }
</script>
<telerik:RadMaskedTextBox runat="server" ID="radusertext" onkeydown="inputKeyDown(event,this);">
</telerik:RadMaskedTextBox>

Note that this is just an idea you can consider and we cannot help further with such implementation as it might cost significant effort and go beyond our support scope.

3) least favorite option show an underline for the masked character. When using "New Telerik.Web.UI.FreeMaskPart()" there is no masked text indication so they at least see where the cursor is in the box

You can use the PromptChar and DisplayPromptChar properties to define a custom character that occupies an empty position. The same PromptChar should normally be applied for the FreeMaskPart. Could you please share if the behavior on your side is different? Here is a sample to test the default one:

<telerik:RadMaskedTextBox runat="server" ID="radusertext" PromptChar="*" DisplayPromptChar="*">
</telerik:RadMaskedTextBox>

VB

Protected Sub Page_Load(sender As Object, e As EventArgs) Handles Me.Load
    If Not IsPostBack Then
        For i As Integer = 0 To 40 - 1
            radusertext.MaskParts.Add(New Telerik.Web.UI.FreeMaskPart())
        Next
        radusertext.SelectionOnFocus = SelectionOnFocus.SelectAll
    End If
End Sub

RadMaskedTextBox is usually used when a fixed amount of symbols is expected to be entered. It might be helpful if you share more about the context of the specific scenario you are facing so we can think of an approach or alternative control that might fit the requirements better.

Kind regards,
Doncho
Progress Telerik