Hi!

I am trying to get the JCE editor to work inside an UIkit3 modal. It has to do something with focus... When I put the editors outside a modal it works, inside you can use CODE and PREVIEW but we're prevented to edit tekst in EDITOR mode. This is most likely because the modal blocks it somehow. So I hope someone has the solution for me :-)

I have 1 or more modals in a page. In the modal there are JCE editors. I put them there with PHP. They do show up but the content is only visible and editable in CODE. How can we trigger the editor active... fingers crossed :D

Regards,
Marc

PS
It is also okay that we don't use php to load the editor but then we need to know how to load the javascripts from jce. Initializing tinymce on an textarea works in a modal but when we remove the editor created via php also the editor js is not included in the document and it offcourse doesn't work.

Hi Ryan,

PHP version that works outside of the modal but not inside:

$editor =& JFactory::getEditor();

<form id="form-for-item-y">
$editor->display( 'title', 'Some text', '100%', '400', '20', '20', false, 'title_for_item_y', null, null, $params);
$editor->display( 'description', 'Some text', '100%', '400', '20', '20', false, 'description_for_item_y', null, null, $params);
</form>

<form id="form-for-item-x">
$editor->display( 'title', 'Some text', '100%', '400', '20', '20', false, 'title_for_item_x', null, null, $params);
$editor->display( 'description', 'Some text', '100%', '400', '20', '20', false, 'description_for_item_x', null, null, $params);
</form>


The JS one:
<textarea id="unique_id"></textarea>
UIkit.util.on('#modal-nieuw', 'show', function () {
tinyMCE.execCommand('mceAddControl',false,'unique_id');
});

The last one creates the editor (and uses JCE) after the field is visible and I can type. The PHP does render it in hidden area on page load but not with the information (text) in it and on display of the modal you can use the code/preview but not type in editor tab :)

Offcourse the JS one depends on the JCE to be loaded. When I do both together (php and the JS) it works for the modal on the 'unique_id' textarea; but when I delete the PHP one it doesn't because you make you code in the correct way so the files are not loaded when the page doesn't request JCE :D

Regards,
Marc

Hi!
I think it is because Yootheme Pro 'injects' the modal just above the closing BODY tag so that elements (editors f.e.) are not in the DOM to be targeted by the JS of editors, does that make sense? And perhaps you know a way to trigger the Joomla Editor with the show function that is in UIkit or Bootstrap; so on a certain event we need to 'fire' of the JCE editor JS. Something like JCE.init() or well, you know better then me :D

Regards!