Jinja, loading javascript script

Question

I have a script that overrides autocomplete

<script type="text/javascript">
$(function() {
$("#autocomplete").autocomplete({
    source:function(request, response) {
        $.getJSON("{{url_for('user.autocomplete')}}",{
            search: request.term, 
        }, function(data) {
            response(data.results); 
        });
    },
    minLength: 2,
    }
});
})

</script>

Later in my code i have the following form

<form method=post action="{{ url_for('user.merge_user')}}">
    <input name="autocomplete" type="text" id="autocomplete" class="form-control input-lg", length="20"/>
    {{ form.user_name(id="autocomplete", class="form-control input-lg") }}
    <input class="btn btn-default" type=submit value=Register>
</form>

The HTML input uses the script as desired but the Jinja version uses the default autocomplete method. How can I get it to use the script?

jonathanhuo11 · Accepted Answer · 2016-09-08 01:44:10Z

2

This is probably the solution you are looking for. It enables Jinja2 to load the JavaScript file before HTML is rendered.

{% block javascript %}
    <script type="text/javascript">
        {% include "script.js" %}
    </script>
{% endblock %}

Also, a similar question can be found here.

Note that if you are using Flask with this solution (which you are), you may experience some issues related to Jinja not finding the JavaScript file on the server. IDK how to fix this; was too lazy anyways.

:3

answered Sep 8, 2016 at 1:44

jonathanhuo11

7581 gold badge6 silver badges11 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Jinja, loading javascript script

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related