Home / Community & Support / Developer Productivity Tools Forums / ASP.NET > General Discussions > RadMaskedTextBox loosing focus on Changing Mask

• Naveen

  Posted on May 24, 2011 (permalink)

  I created a RadMaskedTextBox and changing its mask on event KeyUp depending on first character entered by user.
  If its digit then changing mask as per US Postal. If its letter then changing mask as per Canadian Postal.
  But problem arises that it loses focus and i am unable to continue editing the Masked Text Box.
  
  On setting the focus again explicitly didn't solve the problem.
  
  OnAjaxResponseEnd function has following code snippet: 

   

  var txtPostal = $find("<%= maskedtxtPostal.ClientID %>");
  var varPostal = txtPostal.get_value();
  txtPostal.focus();
  txtPostal.selstart=varPostal.length;

   
  Any idea ?

   

   

   

• Veli Veli

  Posted on May 27, 2011 (permalink)

  Hello Naveen,
  
  As you would need to postback to be able to change the mask (RadMaskedText does not support changing the mask on the client), you need to focus the masked textbox after the postback (or AJAX callback) when the masked textbox has finished loading. You can save the client ID of the masked textbox to focus before changing the mask:
  
  

  var txtPostal = $find("<%= maskedtxtPostal.ClientID %>");

  window.boxToFocus = txtPostal.get_id();

  
  Now you can use the pageLoad() function or another method that will fire when the masked textbox reloads with the updated mask:
  
  

  function pageLoad()

  {

      if(window.boxToFocus)

      {

          $find(window.boxToFocus)._textBoxElement.focus();

      }

  }

  
  
  Veli
  the Telerik team

  Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

• Naveen

  Posted on May 31, 2011 (permalink)

  Thanks for your reply.
  
  After using the suggested approach, the masked textbox is getting focus but cursor is not at the required position in the masked textbox to continue typing. It is always shifted to the start position.
  This function is written on KeyUp event. If existing value in textbox is 25. Then 7 is entered between 2 and 5, then new value would be 275 and cursor should be after 7 but it is not the case. Is there a way to get the current cursor position and use that to set it after changing mask.
  Similarly, if cursor is at end and we pressed back arrow then cursor should keep its new position which is just left of 5.
  Or, if selected text is used from keyboard to copy or paste.
  
  How to bring cursor at required position of text typed in the masked text box ?
  
  When i use txtPostal.get_caretPosition() , it says object doesn't support this property. I am using IE7.
  
  

  var txtPostal = $find("<%= maskedtxtPostal.ClientID %>");

  var varPostal = txtPostal.get_caretPosition(); // Object doesn't support this property.

  
  

• Veli Veli

  Posted on Jun 1, 2011 (permalink)

  Hello Naveen,
  
  get_carentPosition() is a property function for all RadInput components. If your reference to the RadMaskedTextBox client component is correct (txtPostal points to the client component), it should have a get_caretPosition() function. If this issue persists, consider sending us some sample code we can examine. Please try to strip up the unnecessary parts and focus on the relevant RadMaskedTextBox-related code, both markup and code-behind. Please use the code block tool in the editor for formatting.
  
  Veli
  the Telerik team

  Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

• Naveen

  Posted on Jun 1, 2011 (permalink)

  I have attached the code for aspx and code-behind.
  Please suggest.
  (get_caretPosition is not working where used.)

  Attached files

  • Code-Behind.JPG
  • ASPX-2.JPG
  • ASPX-1.JPG

• Veli Veli

  Posted on Jun 1, 2011 (permalink)

  Hello Naveen,
  
  Try with some timeout:
  
  

  function OnAjaxResponseEnd(sender, args)

  {

      var txtPostal = $find("<%= maskedtxtPostal.ClientID %>");

      setTimeout(function()

      {

          txtPostal.focus();

          txtPostal.set_caretPosition(1);

      }, 100);

  }

  
  Attaching the test page I used, based on the sample code you sent me.
  
  Veli
  the Telerik team

  Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

  Attached files

  • testpage.zip

• Naveen

  Posted on Jun 3, 2011 (permalink)

  
  Timeout works.
  
  When varPostal.charAt(0) is used , it is fetching first character irrespective of its position in the maskedtextbox.
  I want to fetch character at 0th index ('r' in below example).
  e.g. User entered :  r_L-__5
  Here 'r' is in lowercase.
  When i tried setting r_L-__5 (or __r-_L5)value to upper case. it is concatenating r,L and 5 making it = R5_-___
  I am losing L in characters changed their position.
  
  Can we keep letters and digits of masked text box in its original positions and Uppercasing only first letter(indexed 0) ?
  

• Veli Veli

  Posted on Jun 6, 2011 (permalink)

  Try with the following:
  
  

  var value = txtPostal.get_value();

  if(value)

  {

      var caret = txtPostal.get_caretPosition();

      value = value.charAt(0).toUpperCase() + value.substr(1);

      txtPostal.set_value(value);

      txtPostal.set_caretPosition(caret);

  }

  
  
  Veli
  the Telerik team

  Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

Back to Top

Home / Community & Support / Developer Productivity Tools Forums / ASP.NET > General Discussions > RadMaskedTextBox loosing focus on Changing Mask