Summernote callbacks onPaste function giving errors

97
January 01, 2020, at 5:20 PM

I'm using summerNote as an HTML editor to write contents in front end. I was a bit concerned about copy pasted contents so I used callBacks logic in which I used onPaste event. Whenever I'm calling the event it gives an error in console log stating Uncaught TypeError: someNote.code is not a function I'm not able to understand why is it so?

Below is the code I'm using

$('#tip_content').summernote(
{
    height: 200,
    focus: false,
    disableDragAndDrop: true,
    popover: {
                image: [],
                link: [],
                air: []
              },
    // disableResizeEditor: true,
    placeholder: "Type Your Post Content...",
    toolbar: [
                ['cleaner',['cleaner']],
                // ['style', ['bold', 'italic', 'underline', 'strikethrough', 'superscript', 'subscript', 'clear']],
                ['style', ['bold', 'italic', 'underline', 'strikethrough', 'superscript', 'subscript']],
                ['para', ['paragraph']],
                ['insert', ['link', 'hr']],
                // ['insert', ['link', 'picture', 'video', 'hr', 'readmore']],
                ['view', ['fullscreen', 'codeview']]
            ],
    cleaner:{
                  action: 'both', // both|button|paste 'button' only cleans via toolbar button, 'paste' only clean when pasting content, both does both options.
                  newline: '<br>', // Summernote's default is to use '<p><br></p>'
                  notStyle: 'position:absolute;top:0;left:0;right:0', // Position of Notification
                  icon: '<i class="note-icon-row-remove"></i> &nbsp;Clean',
                  keepHtml: false, // Remove all Html formats
                  keepOnlyTags: ['<p>', '<br>', '<ul>', '<li>', '<b>', '<strong>','<i>', '<a>'], // If keepHtml is true, remove all tags except these
                  keepClasses: false, // Remove Classes
                  badTags: ['style', 'script', 'applet', 'embed', 'noframes', 'noscript', 'html'], // Remove full tags with contents
                  badAttributes: ['style', 'start'], // Remove attributes from remaining tags
                  limitChars: false, // 0/false|# 0/false disables option
                  limitDisplay: 'both', // text|html|both
                  limitStop: false // true/false
            },
        callbacks:
            {
                onPaste: function (e)
                    {
                        var thisNote = $(this);
                        var updatePastedText = function(someNote)
                            {
                                var original = someNote.code();
                                var cleaned = CleanPastedHTML(original); //this is where to call whatever clean function you want. I have mine in a different file, called CleanPastedHTML.
                                someNote.code('').html(cleaned); //this sets the displayed content editor to the cleaned pasted code.
                            };
                        setTimeout(function ()
                            {
                                updatePastedText(thisNote);
                            }, 10);
                    },
                onChange: function(contents, $editable)
                    {
                        clean_html(this, "b", contents);
                        clean_html(this, "i", contents);
                    }
            }
});

I'm using the below JS code to clean copy-pasted content

function CleanPastedHTML(input)
{
    // 1. remove line breaks / Mso classes
    var stringStripper = /(\n|\r| class=(")?Mso[a-zA-Z]+(")?)/g;
    var output = input.replace(stringStripper, ' ');
    // 2. strip Word generated HTML comments
    var commentSripper = new RegExp('<!--(.*?)-->','g');
    var output = output.replace(commentSripper, '');
    var tagStripper = new RegExp('<(/)*(meta|link|span|\\?xml:|st1:|o:|font)(.*?)>','gi');
    // 3. remove tags leave content if any
    output = output.replace(tagStripper, '');
    // 4. Remove everything in between and including tags '<style(.)style(.)>'
    var badTags = ['style', 'script','applet','embed','noframes','noscript'];
    for (var i=0; i< badTags.length; i++)
        {
            tagStripper = new RegExp('<'+badTags[i]+'.*?'+badTags[i]+'(.*?)>', 'gi');
            output = output.replace(tagStripper, '');
        }
    // 5. remove attributes ' style="..."'
    var badAttributes = ['style', 'start'];
    for (var i=0; i< badAttributes.length; i++)
        {
            var attributeStripper = new RegExp(' ' + badAttributes[i] + '="(.*?)"','gi');
            output = output.replace(attributeStripper, '');
        }
    return output;
}

I'm not sure where it is / what is wrong? Could anyone know what is the problem / can help me out here?

READ ALSO
Having issue using jquery to create link tags and concatenate the href attribute to store a reult variable

Having issue using jquery to create link tags and concatenate the href attribute to store a reult variable

To do so, I created a variable named link to store the link's info as follows:

88
jQuery html method behave strangely inside userScript

jQuery html method behave strangely inside userScript

I have the following line inside a userScript:

110
Can you build static websites with React (Gatsby, Next) in the same way you would with jQuery, with animations and carousels?

Can you build static websites with React (Gatsby, Next) in the same way you would with jQuery, with animations and carousels?

I am new to a company in which websites are built with jQuery and plugins such as WoW and Owl CarouselHowever, I would like to try and work with React for the same purpose

91
progress on delayed data.submit() with blueimp file-upload

progress on delayed data.submit() with blueimp file-upload

I have a case where I have to save the form first - to get an id - which the uploaded files will be related to

83