Reputation: 1247
I am currently trying to use CKEditor to add XML entries. I modified the sample plugin's code:
CKEDITOR.dialog.add( 'abbrDialog', function( editor ) {
return {
title: 'Abbreviation Properties',
minWidth: 400,
minHeight: 200,
contents: [
{
id: 'tab-basic',
label: 'Basic Settings',
elements: [
{
type: 'text',
id: 'abbr',
label: 'Title',
validate: CKEDITOR.dialog.validate.notEmpty( "Title cannot be empty" )
},
{
type: 'text',
id: 'title',
label: 'Price',
validate: CKEDITOR.dialog.validate.notEmpty( "Price cannot be empty" )
}
]
},
{
id: 'tab-adv',
label: 'Advanced Settings',
elements: [
{
type: 'text',
id: 'id',
label: 'Id'
}
]
}
],
onOk: function() {
var dialog = this;
var abbr = editor.document.createElement( 'abbr' );
abbr.setAttribute( 'title', dialog.getValueOf( 'tab-basic', 'title' ) );
abbr.setText( dialog.getValueOf( 'tab-basic', 'abbr' ) );
var id = dialog.getValueOf( 'tab-adv', 'id' );
if ( id )
abbr.setAttribute( 'id', id );
editor.insertElement( abbr );
}
};
});
However, when I click the editor again to add more items the tags became nested, like . This is not desired. How can I restrict that there will be no any tag inside another tag? Thanks
Upvotes: 1
Views: 1140
Reputation: 15895
This will retrieve the element under your caret:
var selectedElement = editor.getSelection().getStartElement();
And with this you can retrieve the closest ascendant of a specific type:
selectedElement.getAscendant( 'abbr', 1 );
Basically, when there's one, don't insert anything and/or update selectedElement
with new attributes, properties, etc.
BTW: This will give you an iterable array of parent elements (towards DOM root) if you wish to have a more specific filtering:
selectedElement.getParents();
Upvotes: 1