Tinymceテキストエディタがブートストラップモーダルウィンドウで動作しない

Question

私のプロジェクトでは、メインウィンドウで正しく動作していますが、ブートストラップモードをロードしようとすると、単純なテキストエリアが表示され、Tinymceのオプションは表示されません。 私のサイトとログイン情報は次のとおりです：hmodelschool.co.nf、email：admin@example.com pass：1234 ニュースセクションでは、tinymceオプションが適切に表示されます。しかし、私がブートストラップで編集しようとすると、モードが変わることはありません。すべきこと。 ここに私のコードを使用しています。 include.top.php cdnからtinymceをロードしています。メインページnews.php で

<!--tinymce text editor--> 
    <script src="//cdn.tinymce.com/4/tinymce.min.js"></script> 
    <script>tinymce.init({ 
    selector: 'textarea', 
    height: 300, 
    theme: 'modern', 
    plugins: [ 
    'advlist autolink lists link image charmap print preview hr anchor 
    pagebreak', 
    'searchreplace wordcount visualblocks visualchars code fullscreen', 
    'insertdatetime media nonbreaking save table contextmenu 
    directionality', 
    'emoticons template paste textcolor colorpicker textpattern 
    imagetools' 
    ], 
    toolbar1: 'insertfile undo redo | styleselect | bold italic | 
    alignleft aligncenter alignright alignjustify | bullist numlist 
    outdent indent | link image', 
    toolbar2: 'print preview media | forecolor backcolor emoticons', 
    image_advtab: true, 
    });</script> 

私はそれを呼んでいる：

<div class="form-group"> 
    <label class="col-sm-3 control-label"> 
    <?php echo get_phrase('news');?></label> <div class="col-sm-5"> 
    <div class="box closable-chat-box"> <div class="box-content padded"> 
    <div class="chat-message-box"> <textarea name="news" id="ttt" 
    rows="5" placeholder="<?php echo get_phrase('add_news');?>" 
    class="form-control"></textarea> </div> 
    </div> 
    </div> 
    </div> 
    </div> 

ともmodal_edit_news.php に私はそれを呼んでいる：

<div class="form-group"> 
    <label class="col-sm-3 control-label"> 
    <?php echo get_phrase('news');?></label> <div class="col-sm-5"> 
    <div class="box closable-chat-box"> <div class="box-content padded"> 
    <div class="chat-message-box"> <textarea name="news" id="ttt" 
    rows="5" placeholder="<?php echo get_phrase('add_news');?>" 
    class="form-control"></textarea> </div> 
    </div> 
    </div> 
    </div> 
    </div> 

そして、 tinymceはブートストラップモーダルでは機能しません。 ご協力いただければ幸いです。

Answer 1

AJAXリクエストでモーダルを読み込む際に同様の問題が発生しました。回避策は、モーダルの読み込み時にTinyMCEエディタを初期化することです。

$('#myModal').on('shown.bs.modal', function() { 
    tinymce.init({ 
    selector: 'textarea', 
    height: 300, 
    theme: 'modern', 
    plugins: [ 
     'advlist autolink lists link image charmap print preview hr anchor 
     pagebreak', 
     'searchreplace wordcount visualblocks visualchars code fullscreen', 
     'insertdatetime media nonbreaking save table contextmenu 
     directionality', 
     'emoticons template paste textcolor colorpicker textpattern 
     imagetools' 
    ], 
    toolbar1: 'insertfile undo redo | styleselect | bold italic | 
    alignleft aligncenter alignright alignjustify | bullist numlist 
    outdent indent | link image', 
    toolbar2: 'print preview media | forecolor backcolor emoticons', 
    image_advtab: true, 
    }); 
})