CODEWITHSUNDEEP
javascriptckeditordata-processing
Vénizia
Vénizia

Reputation: 581

CKEditor - remove script tag with data processor

I am quite new with CKEditor (starting to use it 2 days ago) and I am still fighting with some configuration like removing the tag from editor.

So for example, if a user type in source mode the following:

<script type="text/javascript">alert('hello');</script>

I would like to remove it.

Looking the documentation, I found that this can be done using an HTML filter. I so defined it but it does not work.

var editor = ev.editor;
var dataProcessor = editor.dataProcessor;
var htmlFilter = dataProcessor && dataProcessor.htmlFilter;
htmlFilter.addRules(
    {
        elements :
          {
             script : function(element)
                {
                   alert('Found script :' + element.name);
                   element.remove();
                },
             img : function( element )
                {
                   alert('Found script :' + element.name);
                   if ( !element.attributes.alt )
                       element.attributes.alt = 'Cookingfactory';
                   }
                 }
             });

The img part is working well but not the script one. I guess I missed something. It even does not display the alert message for script.

Any help would be more than welcome :o)

Upvotes: 4

Views: 9095

Answers (3)

Ben
Ben

Reputation: 59

If you are using CKEditor 4.1 or above, you may use Advanced Content Filter to allow the content you want.

If you are using CKEditor 4.4 or above, there is an easier way. You can use Disallowed Content to filter content you don't like .

 config.disallowedContent = 'script';

Upvotes: 1

1nstinct
1nstinct

Reputation: 1775

As I'm having CKEditor 4, I did the next

CKEDITOR.instances.editor1.config.protectedSource.push( /{.*\".*}/g );

It will ignore quotes in smarty curly brackets

Upvotes: 0

EpokK
EpokK

Reputation: 38092

You can use this :

CKEDITOR.replace('editor1', {
   on: {
      pluginsLoaded: function(event) {
         event.editor.dataProcessor.dataFilter.addRules({
            elements: {
               script: function(element) {
                  return false;
               }
            }
         });
      }
   }
});

Upvotes: 3

Related Questions