2016-04-14 64 views
0

我在我的項目中使用tinymce文本編輯器它在主窗口中正常工作,但是當我嘗試加載引導模式時,出現簡單的textarea並且沒有Tinymce的選項。 這是我的網站和登錄信息:hmodelschool.co.nf,電子郵件:[email protected]通過:1234 在新聞部分中,您將看到tinymce選項正確顯示。但是當我嘗試使用bootstrap進行編輯時,modal tinymce的選項不會出現。要做什麼。 在這裏我使用的代碼。 in include.top.php 我從cdn載入tinymce。Tinymce文本編輯器不能在引導模式窗口上工作

<!--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> 
在主頁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> 

以及在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不僅適用於自舉模式。 任何幫助將不勝感激。

回答

2

當通過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, 
    }); 
}) 
+0

請告訴我應該如何以及在哪裏應用我們的代碼?感謝您的回覆。 – Nirob

+0

@Nirob將您的JavaScript代碼放入.js文件,並從您的頁面加載它,就像您使用tinymce.min.js文件一樣。 –

+0

對不起,仍然沒有運氣。 – Nirob