Selective Text Selection OnFocus

4 posts, 0 answers
  1. Xorcist
    Xorcist avatar
    98 posts
    Member since:
    Apr 2009

    Posted 23 Mar 2010 Link to this post

    Okay, so by default it appears that the RadComboBox will select the all text within the textbox portion when it gets focus. Is there any way to prevent this, and or check if some text was pre-selected, such as just a single word of a sentence, so the full text selection does not happen? Currently selecting a single word and releasing the mouse button just re-selects all the text (which is quite annoying to our clients who want quick partial editing abilities (i.e. not having to retype a multi-word entry each time the want to change even a single character). 

    Note: This appears  to happen even after the control already has focus, so this might be more of a click event.
  2. Veselin Vasilev
    Admin
    Veselin Vasilev avatar
    2992 posts

    Posted 24 Mar 2010 Link to this post

    Hello Xorcist,

    To override the default behavior please add the following javascript code after the combobox:

    <script type="text/javascript">
        Telerik.Web.UI.RadComboBox.prototype._onInputCellClick = function(e) {
            if (this._enabled) {
                //  if (this.get_text() !== this.get_emptyMessage())
                //       this.selectText(0, this.get_text().length);
      
                if (!this.get_dropDownVisible() && this._showDropDownOnTextboxClick)
                    this._showDropDown(e);
      
                return true;
            }
        }
    </script>

    Hope this helps.

    Greetings,
    Veskoni
    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. EJ
    EJ avatar
    39 posts
    Member since:
    Jun 2012

    Posted 28 Jul 2010 Link to this post

    Unlike you're experience I'm finding that when you set the focus using the radscriptmanager.setfocus(myradcombobox.ClientId + "_Input"); that it does NOT automatically highlight the text - I want it to highlight the text like it's doing for you but it's not doing that for me. I have my combobox in an edit template within a formview which is inside of a contenttemplate of an updatepanel - I can get it to flash a cursor using the setfocus code but it does not highlight the text and that is what I want.

    FYI when I tab through the form backward and forward i can get it to highlight the text in this radcombobox - it's just when it does setfocus that it does not highlight the text
  4. Yana
    Admin
    Yana avatar
    4907 posts

    Posted 04 Aug 2010 Link to this post

    Hi EJ,

    I guess that your combobox is populated using Load-On-Demand mechanism or has AllowCustomText property set to false. If this is the case, I suggest you focus it with the following code:

    string script =  @"
          function SetFocus()
          {
            setTimeout( function() { var comboBox = $find('" + myradcombobox.ClientID + @"');
                                 
                var input = comboBox.get_inputDomElement();
                input.focus();
                comboBox.selectText(0, comboBox.get_text().length);                   
            },100);               
          }; SetFocus(); ";
     
    ScriptManager.RegisterStartupScript(Page, typeof(Page), "test", script, true);

    If the input field is read-only (AllowCustomText is "false" and EnableLoadOnDemand is "false" ), you should also add the following javascript code to your page:

    <script type="text/javascript">
     
        Telerik.Web.UI.RadComboBox.prototype.selectText = function(startIndex, endIndex) {
            if (!this.get_enableTextSelection())
                return;
     
           /* if ((!this.get_enableLoadOnDemand()) &&
                (this.get_readOnly()))
                return; */
     
     
            if (this.get_inputDomElement().createTextRange) {
                var textRange = this.get_inputDomElement().createTextRange();
     
                if (startIndex == 0 && endIndex == 0) {
                    textRange.collapse(true);
                    return;
                }
     
                textRange.moveStart("character", startIndex);
                textRange.moveEnd("character", endIndex);
                textRange.select();
            }
            else
                this.get_inputDomElement().setSelectionRange(startIndex, startIndex + endIndex);
        }
    </script>

    Hope this helps.

    Best regards,
    Yana
    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
Back to Top