Question

I've scoured the internet looking for an answer to this problem but, alas, I am forced to ask for help.

I am using the cleditor jQuery plugin for its Rich Text/HTML editing capabilities. For the most part, it works fine. However, there's a weird problem if I do the following in IE9:

  1. Click the "Show Source" button at the top right of the toolbar to switch to HTML Mode
  2. Paste the following snippet:

    <p>Note the double-quotes</p>
    <div onclick='alert("hi")'>click me</div>
    
  3. Switch back to Rich Text Mode and make a trivial change (for e.g., add a space)

  4. Switch again to HTML Mode

Note how the double-quotes are now incorrectly escaped like this:

<div onclick="alert(\"hi\")">click me</div>

What the heck is going on here? Other browsers escape the double-quotes properly like this:

<div onclick="alert(&quot;hi&quot;)">click me</div>

I've tried to using the entity, &quot;, myself but it doesn't matter - IE9 still messes it up. Does anyone know how to overcome this issue?

Was it helpful?

Solution

Nevermind, I figured it out. If anyone else is struggling with this issue, I think it's the combination of using cleditor, the XHTML plugin and Internet Explorer.

You can fix it by adding this JavaScript Snippet before your cleditor code:

(function ($) {
    var oldCallback = $.cleditor.defaultOptions.updateTextArea;

    $.cleditor.defaultOptions.updateTextArea = function (html) {
        if (oldCallback) {
            html = oldCallback(html);
        }

        var isIE = /*@cc_on!@*/false;
        if (isIE) {
            return html.replace(/\\\"/g, "&quot;");
        } else {
            return html;
        }
    };
})(jQuery);

Alternatively, you can do the conditional replacement in jquery.cleditor.js (line 1126 for cleditor v1.3.0).

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top