[Solved] Trying to get rid of absolute urls

[Alexander Honcharov]

Hi.

I'm using custom dialog to insert images. It pasteHtml like <img src="cms_image.aspx?id=5414" />. But after moving or copying this image in design mode, the src becomes http://localhost/CMS/Documents/cms_image.aspx?id=5414. Setting ContentFilters to "None" didn't take an effect.

RadControls version 2009.1 402

[Rumen]

Hi Alexander,

when copying and pasting a link or an image with a relative path in Internet Explorer, the browser automatically converts the path to absolute. The code below demonstrates how to attach to the OnClientPasteHtml event and strip the desired url path using the StripPathFilter content filter. The StripPathsFilter() method receives as a parameter an array of strings (devided by a white space) that will be stripped from the absolute path.

<script type="text/javascript">
function OnClientPasteHtml(sender, args)
{
    var commandName = args.get_commandName();
    var value = args.get_value();
    
    if (commandName == "Paste")
    {
       // The StripPathsFilter() method receives as a parameter an array of strings (devided by a white space) that will be stripped from the absolute links.
        var domainName = "http://" + window.location.host; //returns the hostname and port number of the current URL
        var filter = new Telerik.Web.UI.Editor.StripPathsFilter([domainName]); //strip the domain name from the absolute path
                    
        var contentElement = document.createElement("SPAN");
        contentElement.innerHTML = value;
        var newElement = filter.getHtmlContent(contentElement);
        alert(newElement.outerHTML);
        args.set_value(newElement.outerHTML);  //set the modified pasted content in the editor
    }
}
</script>

Please, note that the OnClientPasteHtml event fires the Paste command only when the StripFormattingOnPaste property is not set to "NoneSupressCleanMessage". In this case the editor does not process the pasted content and pastes it without modifications.

Sincerely,
Rumen
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[Alexander Honcharov]

Thank you, Rumen.

But this snippet useless when you drag&drop image across document. Or when you copy image with Ctrl + left mouse button. In theese cases ClientPasteHtml didn't fired.

[Rumen]

Hi Alexander,

You should handle the reported cases yourself by attaching to the ondrop and onpaste events. You can attach to the ondrop / dragdrop event using the following code:

<script type="text/javascript">
function OnClientLoad(editor, args)
{
   var element = document.all ? editor.get_document().body : editor.get_document();
   var eventHandler  = document.all ? "drop" : "dragdrop";
   $telerik.addExternalHandler(element, eventHandler, function(e)
   {
       setTimeout(function()
       {
        alert("before stripping" + editor.get_html(true));
        //write here a regular expression and modify the urls
        alert("after stripping" + editor.get_html(true));
      }, 300);
   });
}
</script>
<telerik:radeditor
   runat="server"
   OnClientLoad="OnClientLoad"
   ID="RadEditor1">
</telerik:radeditor>

Best regards,
Rumen
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.