Opened 6 years ago

Closed 4 years ago

Last modified 4 years ago

#8692 closed New Feature (fixed)

API to allow access to an element before it is inserted in the editor

Reported by: Teresa Monahan Owned by:
Priority: Normal Milestone:
Component: General Version: 3.0
Keywords: IBM Cc: Damian, Satya Minnekanti

Description

When a table is created, we would like to be able to apply attributes/styling to the table element before it is inserted in the editor. Is it possible to expose an API which would give us access to the new element and the dialog data before insertElement() is called in the dialog's onOK function?

While the table element is our current concern, it would be great if a general API was eventually made available that would allow manipulation of any element before it is inserted in the editor.

Change History (6)

comment:1 Changed 6 years ago by Jakub Ś

Status: newconfirmed
Version: 3.6.3 (SVN - trunk)3.0

comment:2 Changed 4 years ago by Piotrek Koszuliński

There's an editor#insertElement event.

comment:3 Changed 4 years ago by Piotrek Koszuliński

Resolution: fixed
Status: confirmedclosed

comment:4 in reply to:  3 Changed 4 years ago by Satya Minnekanti

Replying to Reinmar: Can you please tell us from which build we can see this new fature?

comment:5 Changed 4 years ago by Piotrek Koszuliński

That event is available at least since CKEditor 4.0 and in all CKEditor builds (it's a core event).

comment:6 Changed 4 years ago by Piotrek Koszuliński

To clarify - this event is fired by the editor.insertElement method, so after it was executed. However, it is fired before the element has been inserted into the DOM, because it is inserted into the DOM by the code which is one of its listeners.

So, if you want to do something before the element is inserted, add a listener with a high priority (1-10).

var editor = CKEDITOR.replace( 'editor1' );

editor.on( 'insertElement', function( evt ) {
	console.log( 'with priority 9: ', evt.data.getParent() );
}, null, null, 9 );
editor.on( 'insertElement', function( evt ) {
	console.log( 'with priority 11: ', evt.data.getParent() );
}, null, null, 11 );

This will log:

'with priority 9: null'
'with priority 11: <p>'
Last edited 4 years ago by Piotrek Koszuliński (previous) (diff)
Note: See TracTickets for help on using tickets.
© 2003 – 2017 CKSource – Frederico Knabben. All rights reserved. | Terms of use | Privacy policy