1
Я использовал navalgandhi плагин http://navalgandhi1989.github.io/ckeditor-autocomplete-suggestions-plugin/, чтобы получить автозаполнение в ckeditor, но, когда вы это делаете, я получаю ошибку follwing, помощь PLS.ckeditor autocomplete плагин не работает
Uncaught TypeError: Cannot read property 'execCommand' of undefined ckeditor
Но в локальном порядке его правильное разглаживание.
CKEditor/config.js
/**
* @license Copyright (c) 2003-2014, CKSource - Frederico Knabben. All rights reserved.
* For licensing, see LICENSE.md or http://ckeditor.com/license
*/
CKEDITOR.editorConfig = function(config) {
// Define changes to default configuration here.
// For complete reference see:
// http://docs.ckeditor.com/#!/api/CKEDITOR.config
// The toolbar groups arrangement, optimized for two toolbar rows.
config.toolbarGroups = [
{ name: 'clipboard', groups: [ 'clipboard', 'undo' ] },
{ name: 'editing', groups: [ 'find', 'selection', 'spellchecker' ] },
{ name: 'links' },
{ name: 'insert' },
{ name: 'forms' },
{ name: 'tools' },
{ name: 'document', groups: [ 'mode', 'document', 'doctools' ] },
{ name: 'others' },
'/',
{ name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ] },
{ name: 'paragraph', groups: [ 'list', 'indent', 'blocks', 'align', 'bidi' ] },
{ name: 'styles' },
{ name: 'colors' },
{ name: 'about' }
];
config.extraPlugins = 'autocomplete';
// Remove some buttons provided by the standard plugins, which are
// not needed in the Standard(s) toolbar.
config.removeButtons = 'Underline,Subscript,Superscript';
// Set the most common block elements.
config.format_tags = 'p;h1;h2;h3;pre';
config.fullpage=true;
// Simplify the dialog windows.
config.removeDialogTabs = 'image:advanced;link:advanced';
};
CKEditor/index.js
var Index = {
suggestions : [],
init : function()
{
Index.bindEvents();
//$('#getNewSuggestionsButton1').click();
// Index.getSuggestionsFromServer('data/suggestions1.json');
Index.getSuggestionsFromServer('notification/loadSuggestions');
Index.initCkEditor();
},
bindEvents : function()
{
$('#getNewSuggestionsButton1').on('click', function()
{
Index.getSuggestionsFromServer('data/suggestions1.json');
});
$('#getNewSuggestionsButton2').on('click', function()
{
Index.getSuggestionsFromServer('data/suggestions2.json');
});
},
initCkEditor : function()
{
//Here "CKEDITOR.SHIFT + 51" is the key combination for '#'
$('textarea#ckeditorBox').ckeditor({ suggestionsTriggerKey: { keyCode: CKEDITOR.SHIFT + 51 }});
CKEDITOR.on('instanceReady', function(evt) {
//Here 'Index.suggestions' is the Array which is holding the current list of suggestions
CKEDITOR.instances.ckeditorBox.execCommand('reloadSuggetionBox',Index.suggestions);
});
},
getSuggestionsFromServer : function(url)
{
Index.suggestions = [];
Index.ajaxCall(url,'',Index.getSuggestionsFromServerCallback);
},
getSuggestionsFromServerCallback : function(response)
{
var sugggestions = response.sugggestions;
$.each(sugggestions, function(index,sugggestion)
{
Index.suggestions.push({
"id" : sugggestion.id,
"label" : sugggestion.label
});
});
CKEDITOR.instances.ckeditorBox.execCommand('reloadSuggetionBox',Index.suggestions);
},
ajaxCall : function(urlForAjax,dataForAjax,successCallBack)
{
$.getJSON('/notification/loadSuggestions')
.done(function (resp) { console.log(resp);
successCallBack(resp);
})
}
}
И в CKEditor/плагины/автозаполнение/plugin.js
CKEDITOR.plugins.add('autocomplete',
{
init : function(editor) {
var autocompleteCommand = editor.addCommand('autocomplete', {
exec : function(editor) {
var dummyElement = editor.document
.createElement('span');
editor.insertElement(dummyElement);
var x = 0;
var y = 0;
var obj = dummyElement.$;
while (obj.offsetParent) {
x += obj.offsetLeft;
y += obj.offsetTop;
obj = obj.offsetParent;
}
x += obj.offsetLeft;
y += obj.offsetTop;
dummyElement.remove();
editor.contextMenu.show(editor.document
.getBody(), null, x, y);
}
});
},
afterInit : function(editor) {
editor.on('key', function(evt) {
if (evt.data.keyCode == CKEDITOR.SHIFT + 51) {
editor.execCommand('autocomplete');
}
});
var firstExecution = true;
var dataElement = {};
editor.addCommand('reloadSuggetionBox', {
exec : function(editor) {
if (editor.contextMenu) {
dataElement = {};
editor.addMenuGroup('suggestionBoxGroup');
var Suggestions = ['google', 'facebook', 'github', 'microsoft', 'yahoo'];
$.each(Suggestions,function(i, suggestion)
{
var suggestionBoxItem = "suggestionBoxItem"+ i;
dataElement[suggestionBoxItem] = CKEDITOR.TRISTATE_OFF;
editor.addMenuItem(suggestionBoxItem,
{
id : suggestion.id,
label : suggestion.label,
group : 'suggestionBoxGroup',
icon : null,
onClick : function() {
var data = editor.getData();
var selection = editor.getSelection();
var element = selection.getStartElement();
var ranges = selection.getRanges();
ranges[0].setStart(element.getFirst(), 0);
ranges[0].setEnd(element.getFirst(),0);
editor.insertHtml(this.id + ' ');
},
});
});
if(firstExecution == true)
{
editor.contextMenu.addListener(function(element) {
return dataElement;
});
firstExecution = false;
}
}
}
});
delete editor._.menuItems.paste;
},
});