Custom Field Editor TinyMce

[niosme]

TinyMce is not showing when custom field is set to editor.
In some installations that i have jce edtior the jce is showing and working correct.

Is there any quick fix or it will be fixed in a feature version;

[pinochico]

quick fix: use JCE

[hazael]

Or replace the editor with textarea

[niosme]

quick fix: dont want to use jce because there is no reason in joomla 4. TinyMce became so good.
Text area: cannot enter spaces or bold the letters. A user with no knoweldge in html cannot perform operations like this <b></b> <i></i> etc.

By the way i am using jce but what is so difficult with tinymce to make it work? Any quick fix from anyone on code?
In previous versions it was better to use jce but there is no reason at this time. Its an extra addon which you have to pay.Btw i have the payed version but i prefer to stop using jce editor as there is no reason to use it.

Thanks for the replies

[pinochico]

there is no reason in joomla 4.

Hmm, as you see there is reason
JCE has free option

[niosme]

Why you answering something i didnt questioned? If you cannot answer just dont.
I definitely know that jce have a free version and it have nothing more than tinymce! Installing unnecessary add-ons to fix bugs is not a solution.

The question was if there is a quick fix to use the native joomla tinymce on texteditor till it fixed. Please someone if has that fix i would appreciate.

Thanks in advance

[pinochico]

You are being unnecessarily dramatic and taking it personally

The editor setup was addressed on the joomla forum in 2019:
https://forum.joomla.org/viewtopic.php?t=972913

I assume you searched and found and tried before making the question
Failed?

[pinochico]

ok, so this help not ok for customfield (don't use xml type for customfileds)...

Ok, I find place where is customfields define:
administrator/components/com_virtuemart/models/customfields.php

find section for type X:

core code:

Code Select Expand


//'X'=>'COM_VIRTUEMART_CUSTOM_EDITOR',
case 'X':
        // Not sure why this block is needed to get it to work when editing the customfield (the subsequent block works fine when creating it, ie. in JS)
$document = JFactory::getDocument();
if (strcasecmp(get_class($document),'JDocumentHTML') === 0) {
$editor = JFactory::getEditor();
return '</td><td>'.$editor->display('field['.$row.'][customfield_value]',$field->customfield_value, '550', '400', '60', '20', false);
}
return $priceInput . '</td><td><textarea class="mceInsertContentNew" name="field[' . $row . '][customfield_value]" id="field-' . $row . '-customfield_value">' . $field->customfield_value . '</textarea>
<script type="text/javascript">// Creates a new editor instance
tinymce.execCommand("mceAddControl",true,"field-' . $row . '-customfield_value")
</script>';
break;


and change to

Code Select Expand


case 'X':
// Not sure why this block is needed to get it to work when editing the customfield (the subsequent block works fine when creating it, ie. in JS)
$document = JFactory::getDocument();
if (strcasecmp(get_class($document),'JDocumentHTML') === 0) {
$editor = JFactory::getEditor();
return '</td><td>'.$editor->display('field['.$row.'][customfield_value]',$field->customfield_value, '550', '400', '60', '20', false);
}
/*
return $priceInput . '</td><td><textarea class="mceInsertContentNew" name="field[' . $row . '][customfield_value]" id="field-' . $row . '-customfield_value">' . $field->customfield_value . '</textarea></div>
<script type="text/javascript">// Creates a new editor instance
tinymce.execCommand("mceAddControl",true,"field-' . $row . '-customfield_value")
</script>';
//return '<input type="text" value="'.$field->customfield_value.'" name="field['.$row.'][customfield_value]" /></td><td>'.$priceInput;
*/

$editor = JFactory::getEditor();
return '</td><td>'.$editor->display('field['.$row.'][customfield_value]',$field->customfield_value, '550', '400', '60', '20', false);
break;



Now I see tinymce editor for customfiled type editor

[niosme]

Wow. Thanks for that code.Straight to the point.

This is not working in joomla 4 with php 8.1 but i fixed that and now it is working and i put some more variables on editor instance to be more specific per user different configuration.

It would be nice to be implemented in the new Virtuemart versions. Code i am using based on the above but fixed to fit Joomla 4 needs ( also works with Joomla 3 ) :
replacing the code at administrator/components/com_virtuemart/models/customfields.php at the same place where case 'X' exists ( line 860 ) will fix the problem

Code Select Expand


case 'X':
$user = Joomla\CMS\Factory::getUser();
$editor = Joomla\CMS\Editor\Editor::getInstance($user->getParam('editor', Joomla\CMS\Factory::getConfig()->get('editor')));
return '</td><td>'.$editor->display('field['.$row.'][customfield_value]',$field->customfield_value, '100%', '400', '60', '20', false);
break;


Thanks again for the help.

[Milbo]

Hmm $priceInput . is missing.

But I wonder, works JCE with this also? and what happened with the script?

[niosme]

Yes. I wrote it and didnt check the scripts etc because on the code above they are commented.
This is working and is tested also with php 8.1 and joomla 4 and 3 and latest Virtuemart.

Code Select Expand


case 'X':
$user = Joomla\CMS\Factory::getUser();
$editor = Joomla\CMS\Editor\Editor::getInstance($user->getParam('editor', Joomla\CMS\Factory::getConfig()->get('editor')));

$document = \Joomla\CMS\Factory::getApplication()->getDocument();

if ($document instanceof \Joomla\CMS\Document\HtmlDocument){ //already setted custom field
return '</td><td>'.$editor->display('field['.$row.'][customfield_params]',$field->customfield_params, '100%', '400', '60', '20', false);
}

//first time setting so add editor dynamically to the textarea field
return $priceInput . '</td><td><textarea class="mceInsertContentNew" name="field[' . $row . '][customfield_params]" id="field-' . $row . '-customfield_value">' . $field->customfield_value . '</textarea><script>if(typeof(tinymce) !== "undefined")tinymce.EditorManager.execCommand("mceAddEditor", true, "field-' . $row . '-customfield_value");</script>';

break;


[pinochico]

Code Select Expand

tinymce.EditorManager.execCommand("mceAddEditor"

big thanks,
I try find some similiar commands for tinyMCE, but don't find

[niosme]

Nothing at all

You can right click on a page with tinymce e.g. on a product in administration.Click on inspect and in console type
console.log(tinymce)
It will print you everything about this variable. Or you can type console.log(tinymce.EditorManager)

From the printed results you can see whatever is assign to this var and inspect it and find more!

Also take a look at this documentation : https://www.tiny.cloud/docs/api/tinymce/tinymce.editor/

Hope that helped you!