Search code examples
htmljquerysummernote

Summernote executes escaped html

I fetch data from a MySQL database, the data stored is this:

<p>&lt;script&gt;alert('123');&lt;/script&gt;<br /></p>

When I fetch the data normally I get this as result:

<script>alert('123');</script>

This is fine and works as expected, however when I fetch the data into a textarea which is initialized with Summernote I get an alert like this: enter image description here

Somehow Summernote converts the escaped html tags to functioning HTML.

How do I fix this?

I have already tried the answer of this question:

Escaped HTML in summernote

It did not work.

Solution

  • I managed to fix it by instead of fetching the data in the textarea fetching it in via jQuery like this:

    <textarea name="description" id="description"></textarea>
<script>
    $('#description').summernote({
        height: 250,
        codeviewFilter: false,
        codeviewIframeFilter: true,
        // toolbar
        toolbar: [
            ['font', ['bold', 'italic', 'underline', 'clear']],
            ['color', ['color']],
            ['para', ['ul', 'ol', 'paragraph']],
            ['view', ['fullscreen', 'codeview', 'help']]
        ],
    }).on("summernote.enter", function(we, e) {
        $(this).summernote('pasteHTML', '<br />&VeryThinSpace;');
        e.preventDefault();
    });
    $("#description").summernote("code", "<?php echo $video->getDetails('', $fileName, 'desc'); ?>");
</script>

    Now it doesn't convert > and $lt; to <> if it is the script tag.

    See more information here:

    https://github.com/summernote/summernote/pull/3782#issuecomment-774432392