Accessing ckeditor function from a dialog html element without using "onOk"

Question

I'm trying to create my own plugin and dialog with an html element. When the html element is clicked I would like some text added to the editor. I can't find a way to bypass the onOk function.

If I use editor.insertHtml(' some code ') inside the onOk function the text is added, but if I want to use it outside I get Uncaught TypeError: Cannot read property 'editor' of undefined(…) error.

What is the right way to get to the editor?

CKEDITOR.dialog.add( 'smiley2', function( editor ) {
    return {
        title: 'Abbreviation Properties',
        minWidth: 400,
        minHeight: 200,
        contents: [
            {
                id: 'tab-basic',
                label: 'Basic Settings',
                elements: [
                    {
                        type: 'html',
                        id: '2',
                        label: 'Explanation',
                        html: "<div onclick=\"editor.insertHtml(' some code ')\">add code</a></div></div>"
                    }
                ]
            }
        ],
         onShow : function()
            {          
            document.getElementById(this.getButton('ok').domId).style.display='none'; // disapper ok btn
            },
        onOk: function() {

            editor.insertHtml(' abbr ');
        }
    };
});

user186585 user186585 · Accepted Answer · 2016-12-14T08:39:51

CKEDITOR.dialog.add( 'smiley2', function( editor ) {

    var onChoice = function(evt) {
            var target;
            target = new CKEDITOR.dom.element(evt); 
            editor.insertHtml("SMILEY YES!");
            CKEDITOR.dialog.getCurrent().hide();
    };
    var onClick = CKEDITOR.tools.addFunction(onChoice); 

    return {
        title: 'Abbreviation Properties',
        minWidth: 400,
        minHeight: 200,
        buttons: [CKEDITOR.dialog.cancelButton],
        contents: [
            {
                id: 'tab-basic',
                label: 'Basic Settings',
                elements: [
                    {
                        type: 'html',
                        id: '2',
                        label: 'Explana22tion',
                        html: "<div  onclick=\"CKEDITOR.tools.callFunction(" + onClick +", this); return false;\" >111111</a></div></div>"
                    }
                ]
            }
        ] 

    };
});

Accessing ckeditor function from a dialog html element without using "onOk"

2 Answers