我正在尝试使用包装器在YII2中为summernote小部件添加一个新的自定义按钮:
use marqu3s\summernote\Summernote;
这是我在夏令营样本后面的视图中的代码:
http://summernote.org/deep-dive/
$form->field($model, 'text_body')->widget(Summernote::className(), [
'clientOptions' => [
'id' => 'ysk-summernote',
'toolbar' => [
['mybutton', ['hello']],
['undo', ['undo']],
['redo', ['redo']],
['insert', ['link', 'hr']],
['style', ['bold', 'italic', 'underline', 'clear']],
['font', ['strikethrough', 'superscript', 'subscript']],
['fontsize', ['fontsize']],
['color', ['color']],
['para', ['ul', 'ol', 'paragraph']],
['height', ['height']],
['view', ['codeview']],
['help', ['help']],
],
'height' => 400,
'buttons' => ['hello' => 'HelloButton'],
]
]
);
?>
我还添加了以下js:
<?php
$script = <<< JS
var HelloButton = function (context) {
var ui = $.summernote.ui;
// create button
var button = ui.button({
contents: '<i class="fa fa-child"/> Hello',
tooltip: 'hello',
click: function () {
// invoke insertText method with 'hello' on editor module.
context.invoke('editor.insertText', 'hello');
}
});
return button.render(); // return button as jquery object
}
JS;
$this->registerJs($script);
?>
视图使用编辑器渲染但未显示按钮:
如果我检查工具栏,我可以看到div:
<div class="note-btn-group btn-group note-mybutton"></div>
我试了好几个小时但没有运气,
欢迎任何想法
答案 0 :(得分:0)
如http://summernote.org/deep-dive/#using-button-with-options所述,您必须将其命名为function
,而不是string
。
参考:请参阅https://github.com/summernote/summernote/blob/44157226d362c6aec1b0b6ff0fcdd40573147b61/src/js/bs3/module/Buttons.js#L643以了解summernote如何处理它。