javascript - TinyMCE Save button in the File menu - Stack Overflow

admin管理员组

文章数量:1355731

I am using TinyMCE and I am using an inline editor if that matters. This is my code...

<script type="text/javascript">
tinymce.init({
    selector: "div.prut8Eje",
    inline: true,
    plugins: [
        "advlist autolink lists link image charmap print preview anchor save",
        "searchreplace visualblocks code fullscreen",
        "insertdatetime media table contextmenu paste"
    ],
    menu : { // this is the plete default configuration
        file   : {title : 'File'  , items : 'save newdocument | print'},
        edit   : {title : 'Edit'  , items : 'undo redo | cut copy paste pastetext | selectall'},
        insert : {title : 'Insert', items : 'link media | template hr'},
        view   : {title : 'View'  , items : 'visualaid'},
        format : {title : 'Format', items : 'bold italic underline strikethrough superscript subscript | formats | removeformat'},
        table  : {title : 'Table' , items : 'inserttable tableprops deletetable | cell row column'},
        tools  : {title : 'Tools' , items : 'spellchecker code'}
    },
    toolbar: "save | insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image"
});
</script>

Well, the save button works fine in the toolbar, but doesn't show up in the File Menu. I tried to post pictures, but I need 10 reputation.

Edit: You can see the pictures at

Thanks in advance,

Ben

I am using TinyMCE and I am using an inline editor if that matters. This is my code...

<script type="text/javascript">
tinymce.init({
    selector: "div.prut8Eje",
    inline: true,
    plugins: [
        "advlist autolink lists link image charmap print preview anchor save",
        "searchreplace visualblocks code fullscreen",
        "insertdatetime media table contextmenu paste"
    ],
    menu : { // this is the plete default configuration
        file   : {title : 'File'  , items : 'save newdocument | print'},
        edit   : {title : 'Edit'  , items : 'undo redo | cut copy paste pastetext | selectall'},
        insert : {title : 'Insert', items : 'link media | template hr'},
        view   : {title : 'View'  , items : 'visualaid'},
        format : {title : 'Format', items : 'bold italic underline strikethrough superscript subscript | formats | removeformat'},
        table  : {title : 'Table' , items : 'inserttable tableprops deletetable | cell row column'},
        tools  : {title : 'Tools' , items : 'spellchecker code'}
    },
    toolbar: "save | insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image"
});
</script>

Well, the save button works fine in the toolbar, but doesn't show up in the File Menu. I tried to post pictures, but I need 10 reputation.

Edit: You can see the pictures at http://gyazo./3d08cd176cd7b3cb4c6d6d395884e466 http://gyazo./daed4520adb902cb87336d943d6a30f7

Thanks in advance,

Ben

• javascript
• jquery
• html
• tinymce
• wysiwyg

Share Improve this question Follow asked Jun 7, 2014 at 13:59 Speedysnail6Speedysnail6 6711 silver badge66 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 5

This is an old question, but I found a very easy way to add a Save button to the file menu. Using the setup event in tinymce, you can add a menu item:

tinymce.init({
    .....
    setup: function(editor) {
           editor.addMenuItem('save', {
                icon: 'save',
                text: 'Save',
                cmd: 'mceSave',
                context: 'file',
                disabled: true,
                onPostRender: function () {
                    var self = this;
                    editor.on('nodeChange', function() {
                        self.disabled(editor.getParam("save_enablewhendirty", true) && !editor.isDirty());
                    });
                }
            });|
    }
});

This utilizes all the regular save funtions and the onPostRender function just enables or disables the button (using code I found in the save plugin.js file)

According to their own documentation, the "save" plugin is only for the toolbar and not for the menu: http://www.tinymce./wiki.php/Controls

It looks like you'd have to create your own menu item manually; something like this could work:

tinymce.PluginManager.add('menusave', function(editor, url) {
    editor.addMenuItem('menusave', {
        text: 'Save',
        context: 'file',
        onclick: function() {
            $('.mce-i-save').closest('button').trigger('click');
        }
    });
});

For that to work though, you'd have to have the save button in the toolbar as well, but there are probably better ways to do it than by triggering a click on the button in the toolbar.

Then don't forget to add "menusave" (or whatever you choose to name it) to the list of plugins, and to add it to wherever you want it to be in the menu:

file   : {title : 'File'  , items : 'menusave newdocument | print'},

By the way, to e up with the code above I played with this "TinyMCE Fiddle": http://fiddle.tinymce./ngdaab/0

本文标签： javascriptTinyMCE Save button in the File menuStack Overflow