RadComboBox inserting selected value into a textbox

7 posts, 0 answers
  1. ThePope
    ThePope avatar
    39 posts
    Member since:
    Mar 2007

    Posted 18 Nov 2008 Link to this post

    Hello,
    I have a form that has a radcombobox and a textarea. When the user selects an item from the radcombobox, I want to insert the selected text into the textarea at the cursor position in the textarea. Here is what I have.

     function insertText(sender, eventArgs) { 
             
            var txtPlainText = document.getElementById("<%= txtPlainText.ClientID %>"); 
            var DropDownList1 = $find("<%= ddlMergeFields.ClientID %>"); 
                 
            if (document.selection) { 
                              
                txtPlainText.focus(); 
                sel = document.selection.createRange(); 
                sel.text = DropDownList1.get_value(); 
            } 
            //MOZILLA/NETSCAPE support 
            else if (txtPlainText.selectionStart || txtPlainText.selectionStart == '0') { 
             
                var startPos = txtPlainText.selectionStart; 
                var endPos = txtPlainText.selectionEnd; 
                txtPlainTexttxtPlainText.value = txtPlainText.value.substring(0, startPos) + DropDownList1.get_value() +  
                txtPlainText.value.substring(endPos, txtPlainText.value.length); 
            }  
            else  
            { 
              txtPlainText.value += DropDownList1.get_value(); 
            } 
            DropDownList1.set_value();         
        } 
         

    and the combobox is defined as:
    <telerik:RadComboBox runat="Server" OnClientSelectedIndexChanged="insertText" ID="ddlMergeFields" Skin="Office2007"
        <Items> 
             <telerik:RadComboBoxItem Text="Merge Fields" Value="test2" /> 
             <telerik:RadComboBoxItem Text="test1" Value="test1" /> 
        </Items> 
    </telerik:RadComboBox> 

    The javascript works with a normal dropdownlist, but when i switch it to a radcombobox, it always inserts the text at the top of the textarea, not at the cursor position. Am I doing something wrong?

    Also, after inserting the text, i need the combobox selected item to be reset to the first item in the box. How do I do that? I have tried set_value and clearSelection, but neither work.

    Please Help.

    Patrick
  2. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 21 Nov 2008 Link to this post

    Hello,

    Try out the following code to set the combobox text to that of the first item in the combobox.
    js:
     // after inserting the text
     var combo = $find("<%=ddlMergeFields.ClientID %>"); 
       var items = combo.get_items(); 
       combo.set_text(items.getItem(0).get_text()); 

    Thanks
    Princy.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Veselin Vasilev
    Admin
    Veselin Vasilev avatar
    2992 posts

    Posted 21 Nov 2008 Link to this post

    Hi Patrick,

    I guess you have a textarea somewhere on your page and a combobox.

    It will be not possible to insert the text into the cursor position in the textarea, since the cursor is in the combobox, not in the textarea.

    Best wishes,
    Veselin Vasilev
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  5. ThePope
    ThePope avatar
    39 posts
    Member since:
    Mar 2007

    Posted 21 Nov 2008 Link to this post

    The code works for a dropdownlist. The selected text gets inserted in the textarea at the last cursor position. However, from a look and feel standpoint, I would rather use a radcombo box.

    Is there no way to do this with a radcombobox?
  6. Veselin Vasilev
    Admin
    Veselin Vasilev avatar
    2992 posts

    Posted 24 Nov 2008 Link to this post

    Hi ThePope,

    How exactly this code runs fine with dropdownlist? On which event of the dropdown list you set the text at the cursor position of the textarea?


    Sincerely yours,
    Veselin Vasilev
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  7. David
    David avatar
    3 posts
    Member since:
    Mar 2014

    Posted 31 Oct Link to this post

    We have customized a RadComboBox that builds a text string of names in the textbox field of the combobox by each name from the dropdown.  We want to improve this and replicate a behavior similar to Outlook where individual names can be selected and deleted anywhere in the textbox.  The selected names are stored in a hidden input field and are separated by semicolons.  Another hidden input field carries a CSV list of IDs that have a one-to-one relationship with the names in the first hidden field.  The approach we are considering is to begin by wrapping some kind of tag like a <span> around each name, so that when a user mouses their cursor on a particular name the whole name will be highlighted and can somehow be detected.  Could this be done by using an ItemTemplate?

    The OnClientSelectedIndexChanged event fires the javascript shown, and appends names to the textbox.

  8. Peter Milchev
    Admin
    Peter Milchev avatar
    135 posts

    Posted 03 Nov Link to this post

    Hello David,

    As far as I understand you are trying to implement functionality similar to the AutoCompleteBox with InputType Token. I would like to suggest you to review the AutoCompleteBox' Documentation and Online demos and check if it fits your case better.

    Regards,
    Peter Milchev
    Telerik by Progress
    Check out the new UI for ASP.NET Core, the most complete UI suite for ASP.NET Core development on the market, with 60+ tried-and-tested widgets, based on Kendo UI.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017