2015-04-22 5 views
2

Это обычный сценарий для загрузки заполнителя объекта в вашем CKEditor:CKEditor: пустышку с предопределенными значениями

<!DOCTYPE HTML> 
 
<html> 
 
<head> 
 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
 
<title></title> 
 
    <!-- CK Editor --> 
 
    <script src="//cdn.ckeditor.com/4.4.7/standard-all/ckeditor.js"></script> 
 
</head> 
 
<body> 
 
<textarea id="email_message_new"></textarea> 
 
<script language="javascript"> 
 
\t var ck_edit_new = CKEDITOR.replace('email_message_new', { 
 
\t \t extraPlugins: 'placeholder', 
 
\t \t height: 220 
 
\t }); 
 
</script> 
 
</body> 
 
</html>

Во-вторых: Я пытаюсь загрузить предопределенные значения в CKEditor's Placeholder модальный. Это должно выглядеть как-то вроде этого Screenshot, который здесь был задан (http://ckeditor.com/forums/CKEditor-4-Add-Ons/Modifying-the-placeholder-plugin)

Третье: CKEditor Docs говорит о заполнителем настройки:

Вы можете, например, настроить диалоговое окно, чтобы показать падение - список с заранее определенными параметрами, которые можно выбрать для заполнения .

К сожалению, в их справочнике/документах ничего не найдено. Я хотел бы знать, какой подход был бы «без взлома» (например, путем редактирования placeholder/plugin/config.js), чтобы вывести раскрывающееся меню в окно «Модификация места».

Любая помощь приветствуется Спасибо

+0

Что вы пробовали уже? Единственный код, который у вас есть, - это код, который инициализирует редактор. Советую вам прочитать официальные руководства, например [CKEditor plugin SDK] (http://docs.ckeditor.com/#!/guide/plugin_sdk_intro) и [CKEditor Widgets SDK] (http://docs.ckeditor.com/#!/guide/widget_sdk_intro), после чего у вас не должно возникнуть проблем с изменением плагинов-заполнителей в соответствии с вашими потребностями. – Reinmar

+1

Да, предоставленный код инициализирует экземпляр, включая плагин Placeholder. Мне просто интересно, если это упоминается в документах CKEditor («... раскрывающийся список с заранее определенными параметрами ...» см. [Link] (http://docs.ckeditor.com/#!/guide/dev_placeholder)) либо либо потому, что это обычная вещь, либо они забыли добавить некоторый образец фрагмента? Думаю, мне придется пройти через dev docs. Спасибо – DingDong

+0

Вы когда-нибудь находили ответ? Я сталкиваюсь с той же проблемой, они указывают, что это возможно, но нет документации о том, как это сделать ... –

ответ

0

Следующая запись в блоге по Zachary Olson объясняет, как это сделать: https://zolson.wordpress.com/2011/04/19/ckeditor-placeholder-select/

Вы в основном редактировать файл placholder/dialog/placeholder.js и изменить тип из текста, чтобы выбрать, а затем добавить элементы, которые вы хотите, как показано в следующем коде:

type : 'select', 
items : [ [ 'meetingTime' ], [ 'meetingLocation' ] ], 
'default' : 'meetingTime', 

Вот суть его, но вы можете получить более подробную информацию о his blog post

0

Начиная со слов Стефана, я пришел к немного другому решению. Основная идея, которую я принял, - подождать, пока не появится объект редактора, а затем перерегистрируйте диалог. Действуя таким образом, я не рискую, чтобы мои изменения были перезаписаны при обновлении кода плагина.

Я реализовал эту идею, работая с angular.js. В моем проекте я позаимствовал модуль напарницы, где CKEditor был включен этот путь в MODULENAME-index.html:

<div ckeditor="editorOptions" ng-model="obj.editorModel" ready="onReady()" /> 

Поэтому, когда я взломан (как в «hack'n'slash», а не как в «умном взломе») я определил функцию onReady(), сбросив вызов CHECKEDITOR.dialog.add(), содержащийся в плагине placeholder.js, а затем изменил тип элемента и добавил массив элементов.

0

знаю, что эта нить немного устарела, но у меня была такая же потребность, и я создал плагин, чтобы сделать то, что вам нужно. Он не использует Angular, но достаточно гибкий, чтобы настраиваться через Angular.

Я создал плагин «Захватчики мест с раскрывающегося списка» для CKEditor. Он работает во многом так же, как плагин strinsert, о котором говорит Саймон, хотя и с большей гибкостью.

Вы можете передать конфигурацию, включая «формат» (если вы не хотите использовать формат плагинов pleceholder). Он использует формат заполнителя по умолчанию [[something]], но может использовать что-нибудь еще (например {{something}}).

Токены-заполнители могут быть переданы в виде массива JavaScript через конфигурацию. Плагин сделает все для вас.

https://ckeditor.com/cke4/addon/placeholder_select

3

С CKEditor 4 вы можете расширить placeholder плагин без основных изменений или пользовательских аддонов. Приведенный ниже код изменяет входной заполнитель для избранных, как ваш скриншот:

CKEDITOR.on('dialogDefinition', function(event) { 
    if ('placeholder' == event.data.name) { 
    var input = event.data.definition.getContents('info').get('name'); 
    input.type = 'select'; 
    input.items = [ ['Company'], ['Email'], ['First Name'], ['Last Name'] ]; 
    input.setup = function() { 
     this.setValue('Company'); 
    }; 
    } 
}); 

Источник: http://docs.ckeditor.com/#!/api/CKEDITOR.dialog.definition.select

+0

Знаете ли вы, как отправлять значения input.type = 'radio' на событие onClick? Ваш пример отлично работает, если я попытаюсь представить значения в событии commit, которое активируется нажатием кнопки «ОК», но оно не работает, если я использую событие onClick. –

+1

Это нужно задать как новый вопрос, но я могу вам помочь. Вы можете отслеживать клики на радио и имитировать щелчок на кнопке OK. Если вы используете jQuery, добавьте следующее внутри функции input.setup: '$ ('.cke_dialog_ui_radio_input'). On ('click', function() {$ ('.cke_dialog_ui_button_ok') [0] .click(); }); ' – M4tini

Смежные вопросы