unterminated string literal error for a django template tag

Question

I have the following snippet of code which gives me unterminated string literal error

$(function() {
             $('#addDropdown').click(function() {
             var $d = $('{{ form |bootstrap }}').fadeIn().delay(1000);   
             $('#dropdownContainer').append($d);
             });
             });

I have looked unterminated string literal question and found that it is because multiline problem.My {{ form |bootstrap }} has multiple lines of code as mentioned in the question.So how do I handle the problem

Answer 1

In general, to use with JavaScript, you should use |escapejs filter:

var $d = $('{{ value|escapejs }}');

However, as a matter of best practice you'd better put {{ form|bootstrap }} in HTML, and use JavaScript just to fade in:

<div id="djangoForm" style="display:none">{{ form|bootstrap }}</div>
<script>
    $('#addDropdown').click(function() {
         $('#dropdownContainer').append($('#djangoForm'));
    }
</script>