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

Houman picture Houman · Apr 21, 2013 · Viewed 9.9k times · Source

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?

Answer

Houman picture Houman · Apr 21, 2013

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.