Alex
Alex

Reputation: 53

TinyMCE replace Html tags before submit

I'm trying to replace the html tag '<' '>' with '&lt;' and '&gt;' in my text from TinyMCE before do the page postback.

With TinyMCE v.3.x i can do in this way:

function saveCallback(element_id, html, body) {
    html = html.replace(/</gi, "&lt;");
    html = html.replace(/>/gi, "&gt;");
    return html;
}

function loadCallback(type, value) {
    if (type == "insert_to_editor") {
        value = value.replace(/&lt;/gi, "<");
        value = value.replace(/&gt;/gi, ">");
    }
    return value;
}

tinyMCE.init({
 ...
 save_callback: "saveCallback",
 cleanup_callback: "loadCallback" 
});

with the new TinyMCE v.4.x i've try in this way:

$(function () {
    tinymce.init({
        language: "it",
        width: 500,
        height: 400,
        formats: false,
        menubar: false,    
        mode: "exact",
        elements: "Testo",
        setup: function (editor) {
            editor.on('SaveContent', function (e) {                            
                html = editor.getContent();
                html = html.replace(/</gi, "&lt;");
                html = html.replace(/>/gi, "&gt;");
                editor.getElement().value = html;
            });
        }
    });
});

and in this way:

$(function () {
    tinymce.init({
        language: "it",
        width: 500,
        height: 400,
        formats: false,
        menubar: false,    
        mode: "exact",
        elements: "Testo",
        setup: function (editor) {
            editor.on('submit', function (e) {                            
                html = editor.getContent();
                html = html.replace(/</gi, "&lt;");
                html = html.replace(/>/gi, "&gt;");
                editor.getElement().value = html;
            });
        }
    });
});

But the postback values always contain the html tag and the page return the message "A potentially dangerous Request.Form value was detected"

Upvotes: 5

Views: 5024

Answers (3)

mikewasmike
mikewasmike

Reputation: 388

With tinyMCE 4 try this clean solution, using the PostProcess event:

    tinymce.init({
    language: "it",
    width: 500,
    height: 400,
    formats: false,
    menubar: false,    
    mode: "exact",
    elements: "Testo",                
    init_instance_callback: function (editor) {
            editor.on('PostProcess', function (e) {
                e.content = e.content.replace(/</g, '&lt');
                e.content = e.content.replace(/>/g, '&gt');
            });
        },
});

Upvotes: 0

Alex
Alex

Reputation: 53

I've solved in this way:

tinymce.init({
    selector: "#MySelector",
    width: ...,
    height: ...,
    encoding: 'xml',                        
    setup: function (editor) { editor.on('SaveContent', function (e) { e.content = e.content.replace(/&#39/g, '&apos').replace(/&amp;/g, '&'); }); }
});

Upvotes: 0

chris
chris

Reputation: 56

try the following options in the init

encoding : 'xml',
setup: function (editor) {editor.on('SaveContent', function (e) {e.content = e.content.replace(/&#39/g, '&apos');});}

FYI: adapted from your code above and ref:

http://blog.tentaclesoftware.com/archive/2012/05/21/asp-net-4-0-tinymce-and-ldquoa-potentially-dangerous-request.aspx

works for me :) , hope it helps.

Upvotes: 4

Related Questions