Search code examples
javascriptcodemirror

codemirror - multiple text areas not working

As per the question here Can codemirror be used on multiple textareas?.

I have applied the exact config to my page and neither text areas are being converted to code mirrors.

there are no errors in the console either, im not sure what ive missed?

my code is as follows:

<script src="{% static 'home/scripts/codemirror/codemirror.js' %}"></script>
<link href="{% static 'home/scripts/codemirror/codemirror.css' %}" rel="stylesheet">
<script src="{% static 'home/scripts/codemirror/django/django.js' %}"></script>
<script type="text/javascript"> 
function editor(id) {
        CodeMirror.fromTextArea(id, {
            height: "400px",
            continuousScanning: 500,
            lineNumbers: true
        });
    }
editor('id_config');
editor('id_remote_config');
</script>
<form id="edit_template" action="" method="post">
    {% csrf_token %}
    {{ TemplateForm.template_name }}
    {{ TemplateForm.config }}
    {{ TemplateForm.remote_config }}
    <input type='submit' value='Update' />
</form>

the django form renders the text areas with the IDs I have specified

text area ids

anyone have any ideas? Thanks

Solution

  • Those textareas don't exist at the time you call editor(). Either move your script tag below the form or call editor() inside a window load event handler