Opened 15 years ago
Last modified 11 years ago
#5286 confirmed Bug
Page break visible on a printed page
Reported by: | Wiktor Walc | Owned by: | |
---|---|---|---|
Priority: | Normal | Milestone: | |
Component: | General | Version: | 3.0 |
Keywords: | Cc: |
Description
When printing the content inside of CKEditor (using the "Print" button), page breaks apart from breaking pages correctly, are also printed.
This is a similar problem to issue with printing tables without a border (#731).
Attachments (1)
Change History (4)
Changed 15 years ago by
Attachment: | ckeditor_content_printed.pdf added |
---|
comment:1 Changed 15 years ago by
comment:2 Changed 11 years ago by
Problem can still be reproduced in latest CKEditor 4.3.1.
Here is a workaround for iframe editor:
function hidePageBreaksOnPrint( classname ){ var node = editor.document.$.getElementsByTagName( 'body' )[0];//iframed editor var regExp = new RegExp( '\\b' + classname + '\\b' ); var elements = node.getElementsByTagName( 'div' ); for( var i=0, len=elements.length ; i<len ; i++ ){ if( regExp.test( elements[i].className) ){ elements[i].setAttribute('style', elements[i].getAttribute('style').concat('visibility: hidden;')); } } } function showPageBreaksAfterPrint( classname ){ var node = editor.document.$.getElementsByTagName( 'body' )[0];//iframed editor var regExp = new RegExp( '\\b' + classname + '\\b' ); var elements = node.getElementsByTagName( 'div' ); for( var i=0, len=elements.length ; i<len ; i++ ){ if( regExp.test( elements[i].className) ){ elements[i].setAttribute('style', elements[i].getAttribute('style').replace('visibility: hidden;', '')); } } } //var editor = CKEDITOR.replace( 'editor1'); editor.on( 'instanceReady', function( evt ) { editor.on('beforeCommandExec', function( event ){ if( event.data.name == 'print' ) hidePageBreaksOnPrint('cke_pagebreak'); }); editor.on('afterCommandExec', function( event ){ if( event.data.name == 'print' ) showPageBreaksAfterPrint('cke_pagebreak'); }); });
Very similar workaround can be used for #731 but in case of #731 we have to find table with border 0, class cke_show_borders and then remove this class.
comment:3 Changed 11 years ago by
Here is the solution for inline editor.
<body onbeforeprint="hidePageBreaksOnPrint('cke_pagebreak');" onafterprint="showPageBreaksAfterPrint('cke_pagebreak');"> ... CKEDITOR.disableAutoInline = true; var editor = CKEDITOR.inline( 'editable' ); function hidePageBreaksOnPrint( classname ){ var node = document.getElementsByTagName( 'body' )[0];//inline editor var regExp = new RegExp( '\\b' + classname + '\\b' ); var elements = node.getElementsByTagName( 'div' ); for( var i=0, len=elements.length ; i<len ; i++ ){ if( regExp.test( elements[i].className) ){ elements[i].setAttribute('style', elements[i].getAttribute('style').concat('visibility: hidden;')); } } } function showPageBreaksAfterPrint( classname ){ var node = document.getElementsByTagName( 'body' )[0];//inline editor var regExp = new RegExp( '\\b' + classname + '\\b' ); var elements = node.getElementsByTagName( 'div' ); for( var i=0, len=elements.length ; i<len ; i++ ){ if( regExp.test( elements[i].className) ){ elements[i].setAttribute('style', elements[i].getAttribute('style').replace('visibility: hidden;', '')); } } }
Please note however that onbeforeprint and onafterprint are only supported in Firefox and IE.
Confirmed in FF 3.5.8, IE8 (see the attachment).