dijit.dialog中的TinyMCE编辑器:链接对话框不起作用

时间:2013-06-20 08:47:59

标签: javascript dojo tinymce-4

我正在自己CMS工作。我为此项目使用Dojo Toolkit(版本:1.9)和TinyMCE 4TinyMCE编辑器显示在dijit.Dialogs中,这些编辑器直接在HTML代码中创建(不是以编程方式)。 我已阅读有关JQuery显示工具栏或获取与JQuery UI对话框相关的编辑器内容的问题。但幸运的是,这些问题不是t occur in my project. I use the following code to initialize the TinyMCE编辑:

<script type="text/javascript">
    // other dojo.require calls
    dojo.require("dijit.Dialog");
    require(["dijit/form/Button", "dojo/ready", "dojo/json"], function(Button, ready){
        ready(function(){
            loadPageContent();
        });
      });
       // some JQuery initialize for another plugin not related in any way to TinyMCE (displays toast messages)
        $(function() {
            $("#content .grid_5, #content .grid_6").sortable({
                placeholder: 'ui-state-highlight',
                forcePlaceholderSize: true,
                connectWith: '#content .grid_6, #content .grid_5',
                handle: 'h2',
                revert: true
            });
            $("#content .grid_5, #content .grid_6").disableSelection();
        });
        // The TinyMCE initialization:
        tinymce.init({
            selector: "textarea",
            theme: "modern",
            entity_encoding : "raw",
            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"
            ],
            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>

但是如果我想添加链接,链接对话框不允许我插入URL和名称。我的问题是: 可以在此TinyMCE对话框中选择目标窗口。如果我直接在编辑器中插入URL,它会被识别为链接,但在链接对话框中进行编辑也是不可能的。

TinyMCE中的dijit.Dialog编辑器的HTML代码:

<div dojoType="dijit.Dialog" title="Inhaltselement" id="dialogContentRightElement">
    <div style="width: 45em;">
        <form id="dialogContentElement_form">
        <table border="0">
            <tr>
                <td>Farbe/Stil/Spezialkasten:</td>
                <td>
                    <select name="dialogContentRightElement_form_color" id="dialogContentRightElement_form_color">
                        // some options are here
                    </select>
                </td>
            </tr>
            <tr>
                <td>Titel:</td>
                <td><input dojoType="dijit.form.ValidationTextBox" required="true" name="dialogContentRightElement_form_title" id="dialogContentRightElement_form_title"></input></td>
            </tr>
            <tr>
                <td>Inhalt:</td>
            </tr>
        </table>
        <textarea style="width: 42em; height: 20em;" id="dialogContentRightElement_form_content" name="dialogContentRightElement_form_content"></textarea>
        <button dojoType="dijit.form.Button" onClick="saveContentRightNew()">Speichern</button><button dojoType="dijit.form.Button" onClick="dijit.byId('dialogContentRightElement').hide()">Abbrechen</button>
        </form>
    </div>
</div>

1 个答案:

答案 0 :(得分:1)

找到解决方案:使用dojox.layout.FloatingPane代替dijit.Dialog。但是我不建议使用dojox.layout.FloatingPane,我遇到了很多问题,所以我换回来等待TinyMCE更新才能解决问题。