2016-03-29 8 views
0

http://www.jqueryscript.net/demo/jQuery-Modal-Dialog-Plugin-For-Bootstrap-3-Bootstrap-3-Dialog/examples/にあるjqueryモーダルダイアログクラスを使用しようとしていますが、これまでのところ完全に動作しています。モーダルダイアログでのTinyMCEの使用

TinyMCEの唯一の問題は、TinyMCEをこのフォームに使用することです。私はTinyMCEインスタンスを正常に読み込んでいますが、画像やリンククリエイターウィンドウのように、ポップアップフォームのテキストボックスを編集することができません。

コンソールログを確認したところ、競合やエラーは表示されませんでした。誰かが原因で起こりうる原因を助けてくれますか?

TinyMCEのインスタンス:

<script> 
    tinymce.init({ 
      selector: 'textarea', 
      relative_urls: false, 
      remove_script_host: false, 
      document_base_url: "https://mysite.co.za/", 
      height: "360", 
      fontsize_formats: "8pt 10pt 12pt 14pt 18pt 24pt 36pt", 
      font_formats: "Andale Mono=andale mono,times;" + 
        "Arial=arial,helvetica,sans-serif;" + 
        "Arial Black=arial black,avant garde;" + 
        "Book Antiqua=book antiqua,palatino;" + 
        "Comic Sans MS=comic sans ms,sans-serif;" + 
        "Courier New=courier new,courier;" + 
        "Georgia=georgia,palatino;" + 
        "Helvetica=helvetica;" + 
        "Impact=impact,chicago;" + 
        "Symbol=symbol;" + 
        "Tahoma=tahoma,arial,helvetica,sans-serif;" + 
        "Terminal=terminal,monaco;" + 
        "Times New Roman=times new roman,times;" + 
        "Trebuchet MS=trebuchet ms,geneva;" + 
        "Verdana=verdana,geneva;" + 
        "Webdings=webdings;" + 
        "Wingdings=wingdings,zapf dingbats", 
      plugins: "image,advlist, table, autolink, charmap, code, colorpicker, contextmenu,link, lists, paste, preview, searchreplace, spellchecker, textcolor, wordcount,emoticons", 
      toolbar: "fontselect | fontsizeselect | forecolor | backcolor | bold | italic | underline | alignleft | aligncenter | alignright | alignjustify | bullist | numlist | outdent | indent | link | image | print | media | code", 
      tools: "inserttable", 
      contextmenu: "link image inserttable | cell row column deletetable" 
     }); 
</script> 

モーダルポップアップインスタンス

$("#new").click(function() { 
     BootstrapDialog.show({ 
      title: 'Document', 
      message: $('<div></div>').load('https://mysite.co.za/modals/document_editor.php'), 
      buttons: [{ 
        icon: 'glyphicon glyphicon-send', 
        label: 'Submit', 
        cssClass: 'btn-primary', 
        autospin: false, 
        action: function (dialogRef) { 
          $("#form").submit(); 
          dialogRef.enableButtons(false); 
          dialogRef.setClosable(false); 
          dialogRef.getModalBody().html('<strong>Saving...</strong>'); 
        }}, {label: 'Close', action: function (dialogRef) { 
         dialogRef.close(); 
        }}]});   
    }); 

答えて

2

ブートストラップモーダルは、それが(デザインで)有効になっている間フォーカスを得ることから何かを停止し、コードを持っています。

(これは、あなたのコード例では、すでにあるのjQueryを使用している気にしないと仮定し)

$('#myModal').on('shown.bs.modal', function() { 
    $(document).off('focusin.modal'); 
}); 

:あなたは次のようなコードでこれを上書きすることができるはずです

関連する問題