0

I'm having some trouble with getting TinyMCE to function correctly, see the screenshot below, ignore the CSS issues.

My problem is that when I open the popup a second time, the editor simply won't load.

I found this post which is exactly the problem I am having, but using Fancybox - I've tried to use the solutions provided with no joy..

Can anybody shed some light?

Initialising TinyMCE

jQuery(document).ready(function() {
    jQuery('#personalise_html_body').tinymce({
        // Location of TinyMCE script
        script_url : '/core-js/tinymce/4.0.28/tiny_mce.js',
        theme_url: '/core-js/tinymce/4.0.28/themes/modern/theme.js',
        skin_url: '/core-js/tinymce/4.0.28/skins/lightgray',

            // General options
        language : \"".strtolower($lang)."\",
        theme : \"modern\",
        plugins:  [
            \"textcolor code fullscreen link paste preview moxiemanager\"
        ],
        moxiemanager_title: \"{_T_MEDIA_MANAGER_TITLE}\",
        menubar : false,
        toolbar: [
        \"bold italic underline | alignleft aligncenter alignright alignjustify | formatselect fontselect fontsizeselect |\",
        \"cut copy paste | numlist bullist | undo redo | link unlink  | forecolor backcolor |  insertfile | code preview | fullscreen\"
        ],
        convert_urls: false,

    });
});

I've tried adding callbacks to my Magnific Popup code (got the idea here: TinyMCE & Fancybox - editor won't work on 2nd view) without success:

$('a.personalise').magnificPopup({
        type: 'ajax',
    callbacks: {
        open: function() {
                tinyMCE.execCommand('mceToggleEditor', false, 'personalise_html_body');
        tinyMCE.execCommand('mceAddControl', false, 'personalise_html_body');
            },
        close: function() {
                tinyMCE.execCommand('mceFocus', false, 'personalise_html_body');
                tinyMCE.execCommand('mceRemoveControl', true, 'personalise_html_body');
        }
    }
});
Community
  • 1
  • 1
charj
  • 339
  • 3
  • 13

2 Answers2

1

This was solved using the following code.

It's always the simple things...

$('a.personalise').magnificPopup({
    type:       'ajax',
    callbacks:  {
        close: function() {
            tinymce.remove('#personalise_html_body');
        }
    }
});
charj
  • 339
  • 3
  • 13
1

I found the following solution, when you click on obeh which should cause a popup spend reinitialization TinyMce

function initTiny(){
    setTimeout(function(){
        tinymce.remove(".js-tiny-mce");
        tinymce.init({
            selector: '.js-tiny-mce',
            menubar: false,
            toolbar: [
                'undo redo | bold italic underline | bullist numlist outdent indent'
            ]
        });
    },50); 
}
Narek
  • 11
  • 1