Problem with PasteHTML in IE 7 and 8

Last post 02-25-2010, 12:42 PM by gspagel. 4 replies.
Sort Posts: Previous Next
  •  02-24-2010, 1:57 PM 58950

    Problem with PasteHTML in IE 7 and 8

    Hello --
     
    I created a custom button that allows a user to select text in the editor and create a link using a custom web form.  When I create an HTML string to insert in place of selected text, the editor is wrapping the individual pieces of the string in paragraph tags.  This does not happen in Firefox 3.
     
    Web Control Code
    <CE:Editor ID="articleCopy" ConfigurationPath="/CuteSoft_Client/CuteEditor/Configuration/AutoConfigure/Wizard.config" BreakElement="P" UseStandardDialog="true" ShowPreviewMode="false" ThemeType="Office2007"Height="425px" Width="480px" OnLoad="SetEditorId" runat="server" />

    Javascript Code
    <script type="text/javascript">
        var editor = window.opener.document.getElementById('<%= EditorId %>');

        var doc = editor.GetDocument();
        var win = editor.GetWindow();
        var selectedhtml;

        if (doc.selection && doc.selection.createRange)
        {
           rng = doc.selection.createRange();
          
           if (rng.htmlText)
           {
              selectedhtml = rng.htmlText;
           }
           else if (rng.length >= 1)
           {
              selectedhtml = rng.item(0).outerHTML;
           }
        }
        else if (win.getSelection)
        {
            rng = win.getSelection();
           
            if (rng.rangeCount > 0 && window.XMLSerializer)
            {
                rng = rng.getRangeAt(0);
                selectedhtml = new XMLSerializer().serializeToString(rng.cloneContents());
            }
        }
       
        function setEditorHtml(tab)
        {
            var id;
           
            if (tab == 0)
            {
                id = document.getElementById("tabContainer_contentBrowserTab_contentBrowser_selectedItemId").value.replace(/\W+/g, '');
            }
            else
            {
                id = document.getElementById("tabContainer_mediaBrowserTab_mediaBrowser_selectedItemId").value.replace(/\W+/g, '');
            }
           
            var html = '<a href="~/link.aspx?_id=' + id + '&amp;_z=z">' + selectedhtml + '</a>';
            editor.PasteHTML(html);
            window.close();
        }
    </script>
     What I see in the editor's HTML view before invoking my custom action:
    <p>This is the first sentence.</p>
    <p>This is the second sentence.</p>
    What I see in the editor's HTML view when I select the second sentence and the above script runs in IE 7/8:
    <p>This is the first sentence.</p>
    <p><a href="~/link.aspx?_id=7B89C93AB52A4457B553A26D55C713F3&amp;_z=z"> </p>
    <p>This is the second sentence.</p>
    <p></a>&nbsp;</p>
                But, in Firefox 3:
    <p>This is the first sentence.</p>
    <p><a href="~/link.aspx?_id=7B89C93AB52A4457B553A26D55C713F3&amp;_z=z">This is the second sentence. </a></p>
    So what's the scoop?  I can't seem to figure out what's causing this problem.  I thought it might be carriage returns/line feeds in the selected HTML, but stripping the whitespace from both ends had no effect.  Any ideas?
     
    Thanks in advance,
     
    Geoffrey
     
  •  02-24-2010, 2:21 PM 58953 in reply to 58950

    Re: Problem with PasteHTML in IE 7 and 8

  •  02-24-2010, 2:42 PM 58954 in reply to 58953

    Re: Problem with PasteHTML in IE 7 and 8

    Hi Adam --

    Here's the screenshot of the alert window:

  •  02-25-2010, 12:06 AM 58961 in reply to 58954

    Re: Problem with PasteHTML in IE 7 and 8

    Hi gspagel,
     
    It works fine for me both firefox and ie. Can you try the example below?
     
    1. <%@ Page Language="C#" %>   
    2.   
    3. <%@ Register Assembly="CuteEditor" Namespace="CuteEditor" TagPrefix="CE" %>   
    4. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">   
    5. <html xmlns="http://www.w3.org/1999/xhtml">   
    6. <head runat="server">   
    7.     <title>Untitled Page</title>   
    8. </head>   
    9.   
    10. <script runat="server">   
    11.     protected override void OnLoad(EventArgs e)   
    12.     {   
    13.         editor1.Text = "<p>This is the first sentence.</p><p>This is the second sentence.</p>";   
    14.   
    15.         base.OnLoad(e);   
    16.     }   
    17.       
    18. </script>   
    19.   
    20. <body>   
    21.     <form id="form1" runat="server">   
    22.         <CE:Editor ID="editor1" runat="server">   
    23.         </CE:Editor>   
    24.         <input type="button" onclick="setEditorHtml()" value="Set A link" />   
    25.         <script type="text/javascript">   
    26.         var editor = document.getElementById('<%= editor1.ClientID %>');   
    27.         var selectedhtml="test";   
    28.         function setEditorHtml()   
    29.         {   
    30.             var html = '<a href="~/link.aspx?_id=&amp;_z=z">' + selectedhtml + '</a>';   
    31.             editor.PasteHTML(html);   
    32.         }   
    33. </script>   
    34.     </form>   
    35. </body>   
    36. </html>  
    Regards,
     
    Ken
  •  02-25-2010, 12:42 PM 58988 in reply to 58961

    Re: Problem with PasteHTML in IE 7 and 8

    Hi Ken --
     
    Your post gave me an idea.  I tried setting the selectedhtml variable myself, first to a plain text string with no HTML tags, then a string wrapped in paragraph tags, and finally a string wrapped in strong tags.  The result was very telling.
     
    As you might guess, the plain text string produced a perfect result.  Everything looked fine.  Same with the text wrapped in strong tags.  But the massive failure came with the text wrapped in paragraph tags.  So the take-home lesson is: strip any opening and closing paragraph tags before you paste the HTML.
     
    Any chance you guys could build this functionality into the editor so we don't have to do it manually?
     
    As a side note, we also found that when you select text that falls to the right of a line break tag, when you paste the new HTML the editor removes that tag (but correctly pastes the selected text).
     
    Thanks for the help!
     
    Geoffrey
     
     
View as RSS news feed in XML