Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

ModelForm doesn't render TinyMCE (ReferenceError: tinyMCE is not defined)

I have got django-tinymce working for the admin page. Now outside the admin page, when using a modelform I was expecting the TinyMCE editor to be loaded and shown to the user, this however didn't happen. All I see is a plain text area. But it works in admin page.

from tinymce.models import HTMLField
class Punch(models.Model):
    discussion      = HTMLField()

class PunchForm(forms.ModelForm):    
    class Meta:
        model = Punch

I can see with firebug that the TinyMCE snippet is added to the HTML:

enter image description here

However I get an error message in the console:

ReferenceError: tinyMCE is not defined

That makes no sense, why does the admin page have no problems finding the TinyMCE? Besides I added it even myself to the base.html:

<script type="text/javascript" src="{{ STATIC_URL }}tiny_mce/tiny_mce.js"></script>

And the server can load it too:

[21/Apr/2013 13:42:40] "GET /static/tiny_mce/tiny_mce.js HTTP/1.1" 304 0

SO what could be the problem please?

like image 828
Houman Avatar asked Apr 21 '13 11:04

Houman


People also ask

How do you reload TinyMCE?

You need to use the remove() API to detach TinyMCE from the DOM before you close your Modal window. You can then use init() again when the modal is recreated.

What is Django TinyMCE?

django-tinymce is a Django application that contains a widget to render a form field as a TinyMCE editor. Features: Use as a form widget or with a view. Enhanced support for content languages. Integration with the TinyMCE spellchecker.

How do you destroy TinyMCE?

Use tinymce. remove() method to remove TinyMCE editor from the HTML element and again call tinymce. init() on the selector to reinitialize.


1 Answers

oh dear, what a silly mistake.

So I can confirm that I have to define the js in base.html as I did in my question.

<script type="text/javascript" src="{{ STATIC_URL }}tiny_mce/tiny_mce.js"></script>

However this has to be in the header and not the body. Header is initialized first and hence there won't be any longer a ReferenceError: tinyMCE is not defined

Hope it helps someone else.

like image 91
Houman Avatar answered Nov 07 '22 23:11

Houman