Opened 5 years ago

Closed 2 years ago

Last modified 2 years ago

#8692 closed New Feature (fixed)

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

Reported by: tmonahan Owned by:
Priority: Normal Milestone:
Component: General Version: 3.0
Keywords: IBM Cc: damo, satya

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 5 years ago by j.swiderski

  • Status changed from new to confirmed
  • Version changed from 3.6.3 (SVN - trunk) to 3.0

comment:2 Changed 2 years ago by Reinmar

There's an editor#insertElement event.

comment:3 follow-up: Changed 2 years ago by Reinmar

  • Resolution set to fixed
  • Status changed from confirmed to closed

comment:4 in reply to: ↑ 3 Changed 2 years ago by satya

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

comment:5 Changed 2 years ago by Reinmar

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

comment:6 Changed 2 years ago by Reinmar

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 2 years ago by Reinmar (previous) (diff)
Note: See TracTickets for help on using tickets.
© 2003 – 2016 CKSource – Frederico Knabben. All rights reserved. | Terms of use | Privacy policy