Using django-froala-editor, the editor works in admin page won't work in post page?Uncaught TypeError: $(…).froalaEditor is not a function

Question

Sorry if my previous post wasn't clear. I'm using django-froala-editor, https://github.com/froala/django-froala-editor but it just won't work. I remember using this in my last project but this time it won't work. I installed and configured it ,inside admin page it works but outside admin page it won't work. I did as the doc said {{form.media}} and it won't work. In console I get U$(...).froalaEditor is not a function

<script>
            $(function(){
                $('#id_content').froalaEditor({"imageUploadURL": "/froala_editor/image_upload/", "fileUploadParams": {"csrfmiddlewaretoken": getCookie("csrftoken")}, "inlineMode": false, "fileUploadURL": "/froala_editor/file_upload/", "imageUploadParams": {"csrfmiddlewaretoken": getCookie("csrftoken")}})
            });
        </script>

which I didn't write. I have this instead

    {{ form | as_bootstrap }}

and in my forms.py

    content = forms.CharField(widget=FroalaEditor)

Is froala editor dead? or am I doing it wrong?

Answer 1

If the getCookie function is not set, then perhaps add it as per this page: https://docs.djangoproject.com/en/1.9/ref/csrf/

// using jQuery
function getCookie(name) {
    var cookieValue = null;
    if (document.cookie && document.cookie != '') {
        var cookies = document.cookie.split(';');
        for (var i = 0; i < cookies.length; i++) {
            var cookie = jQuery.trim(cookies[i]);
            // Does this cookie string begin with the name we want?
            if (cookie.substring(0, name.length + 1) == (name + '=')) {
                cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
                break;
            }
        }
    }
    return cookieValue;
}

So just add it to your project. Also make sure you have included all files. Perhaps you are missing a file which already has this function added.