2017-01-30 25 views
0

私はmarqu3s \ summernote \ Summernoteによって歪められたYii2でsummernoteを実装しています。 https://github.com/undeman/yii2-summernoteyii2 summernoteウィジェットツールバーオプションを設定

が、私はsummernoteのマニュアルに示すツールバーのオプションを追加して管理することはできません。 http://summernote.org/deep-dive/

どのように私はそれを使用しようとしているが、ときに私は、ツールバーが消えるツールバーのオプションを追加し、これまでだと。

$tabReport .= $form->field($model, 'ysk')->widget(Summernote::className(), [ 
    'clientOptions' => [ 
     'placeholder' => 'You can write here some important public notes to be display on top of the report...', 
     'minHeight' => 100, 
     'toolbar' => [ 
      'style' => ['bold', 'italic', 'underline', 'clear'], 
     ], 
    ], 
    ] 
); 

手がかりはありますか?

答えて

0

あなたの配列形式が間違っている魔法のように動作:

'toolbar' => [ 
    'style' => ['bold', 'italic', 'underline', 'clear'], 
], 

はJSを生成します。

'toolbar' => [ 
    ['style', ['style']], 
    ['font', ['bold', 'italic', 'underline', 'clear']], 
    ['fontname', ['fontname']], 
    ['color', ['color']], 
    ['para', ['ul', 'ol', 'paragraph']], 
    ['height', ['height']], 
    ['table', ['table']], 
    ['insert', ['link', 'picture', 'hr']], 
    ['view', ['fullscreen', 'codeview']], 
    ['help', ['help']], 
] 
:あなたの your answerの場合

'toolbar' => [ 
    ['style': ['bold', 'italic', 'underline', 'clear']] 
] 

'toolbar': {'style': ['bold', 'italic', 'underline', 'clear']} 

必要なjsのは、あなたと同じように同じ構造を使用して製造するためにはjavascriptをIEで

+0

もっとオプション:http://summernote.org/deep-dive/ –

0

ツールバーオプションをjsで直接ポストする必要があるようです。

何私がやったことは、メインクライアントオプションにIDを追加することです:

$tabReport .= $form->field($model, 'ysk')->widget(Summernote::className(), [ 
    'clientOptions' => [ 
     'placeholder' => 'You can write here some important public notes to be display on top of the report...', 
     'minHeight' => 100, 
     'id' => 'ysk-summernote', 
    ], 
    ] 
); 

、その後、私のapp.jsでJSを経由して、ツールバーのオプションを追加(またはより良いビューに登録すること)

$('#book-ysk').summernote({ 
    toolbar: [ 
     ['style', ['style']], 
     ['font', ['bold', 'italic', 'underline', 'clear']], 
     ['fontname', ['fontname']], 
     ['color', ['color']], 
     ['para', ['ul', 'ol', 'paragraph']], 
     ['height', ['height']], 
     ['table', ['table']], 
     ['insert', ['link', 'picture', 'hr']], 
     ['view', ['fullscreen', 'codeview']], 
     ['help', ['help']], 
    ] 
}); 

そして

関連する問題