Home / Community & Support / Knowledge Base / RadControls for ASP.NET and ASP.NET AJAX / ComboBox / Pasting content from RadComboBox item in RadEditor at cursor position

Pasting content from RadComboBox item in RadEditor at cursor position

Article Info

Rating: Not rated

Article information

Article relates to

 RadEditor for ASP.NET AJAX,
 RadComboBox for ASP.NET AJAX,
 Telerik.Web.UI

Created by

 Rumen Zhekov


HOW-TO
Paste content from RadComboBox item in RadEditor at cursor position

SOLUTION
When the user clicks on the combobox control the selection in the editor's content area is lost. The code below demonstrates how to make all comboboxes' items unselectable to prevent selection lost in RadEditor's content area.
In addition the getSelectedItemValue function is attached to the OnClientSelectedIndexChanged event of RadCombobox and pastes the selected item value at cursor position in the editor when the user selects a combobox item:
Default.aspx:
<script type="text/javascript">
function OnClientLoad(combobox, args)
{
    makeUnselectable(combobox.get_element());
}
  
function OnClientItemsRequested(combobox, args)
{
    $telerik.$("*", combobox.get_dropDownElement()).attr("unselectable", "on");
}
      
//Make all combobox items unselectable to prevent selection in editor being lost
function makeUnselectable(element)
{
    $telerik.$("*", element).attr("unselectable", "on");
}
    
function getSelectedItemValue(combobox, args)
{
  var value = combobox.get_value();
  //alert("The selected combobox value is: " + value);
  //get a reference to RadEditor client object 
  //and paste the selected combobox item content in it
  var editor = $find("<%=RadEditor1.ClientID%>"); 
  editor.pasteHtml(value);
}  
</script>
<telerik:radeditor runat="server" ID="RadEditor1" Content="test mest"></telerik:radeditor>
<div style="padding: 15px 0 0 0;font-family:Arial;font-size:14px;">
    RadComboBox with static items:
    <telerik:RadComboBox OnClientSelectedIndexChanged="getSelectedItemValue" OnClientLoad="OnClientLoad" ID="RadCombobox1" runat="server">
        <Items>
            <telerik:RadComboBoxItem Text="Item1" Value="<strong>Item 1</strong>" />
            <telerik:RadComboBoxItem Text="Item2" Value="<strong>Item 2</strong>" />
            <telerik:RadComboBoxItem Text="Item3" Value="<strong>Item 3</strong>" />
        </Items>
    </telerik:RadComboBox>
</div>
<div style="padding: 15px 0 0 0;font-family:Arial;font-size:14px;">
    RadComboBox with Load-On-Demand:
    <telerik:RadComboBox OnClientSelectedIndexChanged="getSelectedItemValue" OnClientItemsRequested="OnClientItemsRequested" OnClientLoad="OnClientLoad" ID="RadCombobox2" runat="server" 
        OnItemsRequested="RadCombobox2_ItemsRequested" EnableLoadOnDemand="true"></telerik:RadComboBox>
</div>

Default.aspx.cs:
using Telerik.Web.UI;
      
protected void RadCombobox2_ItemsRequested(object o, Telerik.Web.UI.RadComboBoxItemsRequestedEventArgs e)
{
        for (int i = 0; i < 10; i++)
        {
            RadCombobox2.Items.Add(new RadComboBoxItem("Item" + i.ToString(), "<strong>Item " + i.ToString() + "</strong>"));
        }
}

Comments

There are no comments yet.
If you'd like to comment on this KB article, please, send us a Support Ticket.
Thank you!

Please Sign In to rate this article.