New to Telerik UI for ASP.NET AJAXStart a free 30-day trial

Open Link in a New Window on Double Click

The example demonstrates how to attach an ondblclick (on double click) event handler to the editor content area, check whether the selection is an A tag and if it is to open it in a new window:

ASP.NET
<script type="text/javascript">
	function OnClientLoad(editor, args)
	{
		editor.attachEventHandler("ondblclick", function (e)
		{
			var sel = editor.getSelection().getParentElement(); //get the currently selected element
			var href = null;
			if (sel.tagName == "A")
			{
				href = sel.href; //get the href value of the selected link
				window.open(href, null, "height=500,width=500,status=no,toolbar=no,menubar=no,location=no");
				return false;
			}
		}
 );
	}
</script>
<asp:ScriptManager id="ScriptManager1" runat="server"/>
<telerik:radeditor runat="server" ID="RadEditor2"
OnClientLoad="OnClientLoad" >
   <Content>
	   Sample Content <a href="https://www.telerik.com">Open Telerik.com</a> Sample Content  
   </Content>
</telerik:radeditor> 

We can further enhance the example by programmatically setting a title attribute with "Doubleclick to open the link in a new window" value to all links in the content area. You can do that with the following code:

JavaScript
var link = editor.get_document().getElementsByTagName("A"); //get a reference to the links in the content area of RadEditor
for (var i = 0; i < link.length; i++)
{
	link[i].setAttribute("title", "Double click to open the link in a new window");
}	  

Here is the complete solution:

ASP.NET
<script type="text/javascript">
	function OnClientLoad(editor, args)
	{
		var link = editor.get_document().getElementsByTagName("A"); //get a reference to the links in the content area of RadEditor
		for (var i = 0; i < link.length; i++)
		{
			link[i].setAttribute("title", "Double click to open the link in a new window");
		}
		editor.attachEventHandler("ondblclick", function (e)
		{
			var sel = editor.getSelection().getParentElement(); //get the currently selected element
			var href = null;
			if (sel.tagName == "A")
			{
				href = sel.href; //get the href value of the selected link
				window.open(href, null, "height=500,width=500,status=no,toolbar=no,menubar=no,location=no");
				return false;
			}
		}
);
	}
</script>
<asp:ScriptManager id="ScriptManager" runat="server"/>
<telerik:radeditor runat="server" ID="RadEditor1"
OnClientLoad="OnClientLoad" >
  <Content>
	   Sample Content <a href="https://www.telerik.com">Open Telerik.com</a> Sample Content  
  </Content>
</telerik:radeditor> 
Not finding the help you need?
Contact Support