CODEWITHSUNDEEP
ckeditor
SamJolly
SamJolly

Reputation: 6477

CKEditor 4.4.5 removing page throw html, how to prevent?

In previous versions(3.5) of CKEditor I was able to enter:

<br style="page-break-after: always;" />

However, after upgrading to 4.4.5, I noticed that the RTE no longer shows this HTML source, from the Database column, and so if one resaves the form with this RTE on it, then NULL is saved back to the database. It seems that CKEditor is stripping this HTML out for some reason.

How can I prevent this?

Many thanks.

EDIT 1

Discovered this to be added to config.js:

    config.allowedContent = 'br {page-break-after}';

But does not work, although it should do....

EDIT 2

Link for above config setting

EDIT 3

I can try to enter the above HTML, in HTML Source View, but if I toggle the HTML Source button, and go back to Source View, it is now gone. So CKEditor is stripping this HTML out for some reason.

EDIT 4

Removed as now irrelevant

EDIT 5

Looking at the Browser source I see:

<textarea class="RuleRTE" cols="20" id="myCk" rows="2">&lt;br style=&quot;page-break-after: always;&quot; /&gt;  </textarea>

So clearly the data is there and being retrieved, but being converted which prevents me seeing it in the HTML Source view.

I have now found this is irrelevant as <p>test</p> test fine and it gets converted as well, I guess to prevent it being rendered like normal HTML in the page. So it seems the CKEditor does not like the
tag ???

EDIT 6:

Removed as now irrelevant to question.

EDIT 7:

Debug JS:

<script type="text/javascript" language="javascript">

  var editor = CKEDITOR.replace('Content', {
    allowedContent: 'br[*]'
  });

  editor.on('instanceReady', function () {
    console.log(editor.filter.allowedContent);
  });

Results seem to show allowedContent is working fine, but BR element still invisible.

 [Object, Object]
 0: Object attributes: true 
 classes: null 
 elements: Object br: true

Upvotes: 1

Views: 213

Answers (1)

Paul Sasik
Paul Sasik

Reputation: 81537

I suspect that there's a syntax or usage error with the way you're attempting to modify the allowedContent setting. Try doing something more simple along these lines: (do it in code rather than the config file)

var your_ck_editor = CKEDITOR.replace( 'your_ck_element_id', {
    allowedContent: 'br[*]'
} );

The br[*] setting should allow any <br /> element with any attribute.

For troubleshooting purposes try this:

console.log( your_ck_editor.filter.allowedContent );

If this code does not work for you please post all the code that you use to set up your CKEditor as well as the output of your console.log call.

Upvotes: 1

Related Questions