OnKeyPress and caret position

6 posts, 0 answers
  1. Mike
    Mike avatar
    36 posts
    Member since:
    Sep 2012

    Posted 16 Jul 2010 Link to this post

    Hello,

    Is there a feasible way of determining what the new value will be of an input control inside of a OnKeyPress client-side handler?

    - I've seen a lot of postings here showing sender.get_value() + args.get_keyCharacter() - but of course that assumes that the user is typing straight through and the cursor is at the end of the control. Not always the case! ;)
    - The reason I'm looking to do this is to implement regex validation in real time (keydown or OnKeyPress), before the control loses focus. OnValueChanged and OnValueChanging occur on blur. (ASP.NET validation on post-back is clumsy and not appropriate for the circumstances we need this).

    Ideally, though, Telerik could release a RegEx version of RadTextBox!

    Thanks,

    - Mike
  2. Tsvetina
    Admin
    Tsvetina avatar
    2481 posts

    Posted 21 Jul 2010 Link to this post

    Hi Mike,

    You can attach an onkeyup javascript event to the RadTextBox in the PageLoad event handler, by using the following code:
    RadTextBox1.Attributes.Add("onkeyup", "OnKeyUp(this, event);");

    Then, it is easy to get the full value (including the last-typed character) of the text box, by using the get_textBoxValue() client-side method of the control:

    function OnKeyUp(sender, eventArgs) {
                var textBox = $find("<%= RadTextBox1.ClientID %>");
                var textInput= textBox.get_textBoxValue();
            }


    Greetings,
    Tsvetina
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  3. Mike
    Mike avatar
    36 posts
    Member since:
    Sep 2012

    Posted 21 Jul 2010 Link to this post

    Hello,

    Thanks for your response. The problem with examining the value on KeyUp is that I want to do real-time validation of the text box value - as you do with your other textbox-based controls. If I wait until KeyUp, the value is already there in the text box, visible to the user.

    - Mike
  4. Tsvetina
    Admin
    Tsvetina avatar
    2481 posts

    Posted 22 Jul 2010 Link to this post

    Hi Mike,

    In this case you can wire OnKeyPress client-side event of the control, take the text box value, split it at the caret position and insert the new key character there. In this way you will get the new value of the textbox before the new character appears in it.

    function OnKeyPress(sender, eventArgs) {
                var oldText = sender._textBoxElement.value;
                var substr1 = oldText.substr(0, sender.get_caretPosition());
                var substr2 = oldText.substr(sender.get_caretPosition());
                var newText = substr1 + eventArgs.get_keyCharacter() + substr2;
            }

    I hope this helps.

    All the best,
    Tsvetina
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  5. Nicolaas
    Nicolaas avatar
    3 posts
    Member since:
    May 2011

    Posted 23 May 2011 Link to this post

    This doesnt work if the user selects the the text (currently in the textbox) and then types.

    The this code appends it or puts it in front (where the cursor is)
  6. Tsvetina
    Admin
    Tsvetina avatar
    2481 posts

    Posted 26 May 2011 Link to this post

    Hi Nicolaas,

    In such scenario you can check in advance whether the text in the textbox is already selected, using an approach similar to:
    http://stackoverflow.com/questions/3046623/check-if-an-input-item-text-is-already-selected

    All the best,
    Tsvetina
    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