Как: шаблону django передать массив и использовать его в javascript?

Question

Хорошо, вот проблема, У меня есть шаблон HTML, который выглядит примерно так:

<script>
    $(function() {
        var vCountries = {{ visitedCountriesList }};
    });
</script>

<..>

{{ visitedCountriesList }}

с сервера я передаю список этому элементу, но после рендеринга он выглядит так:

<script>
    $(function() {
            var vCountries = ;
        });
    </script>

    <..>

    [u'Afghanistan', u'Japan', u'United Arab Emirates']

поэтому мой вопрос - почему? и как я могу передать его в javascript ...?

Answer 1

Проблема в том, что строковое представление массива не является допустимым JavaScript. u' в начале не годится. Это:

[u'Afghanistan', u'Japan', u'United Arab Emirates']

должно быть так:

['Afghanistan', 'Japan', 'United Arab Emirates']

У вас есть два варианта. В функции представления закодируйте это как JSON там:

render_to_response('my_view.html', {
    'visitedCountriesList' : json.dumps(visitedCountriesList)
})

или создайте фильтр, который вы можете использовать. См. этот один для примера. Тогда использование просто:

<script>
  $(function() {
    var vCountries = {{ visitedCountriesList|jsonify }};
  });
</script>

Answer 2

Вы должны иметь в своем html идентификатор с отображаемой переменной и посмотреть его там, давайте сделаем пример:

<...>
    <loldiv id="myvar" data="{{info}}"/>
<...>

и в вашем javascript:

<script>
$(function() {
    var vCountries = $("#myvar").attr("data");
});
</script>

Предполагается, что вы используете jQuery.

Я действительно не знаю, почему этот шаблон присваивает переменную, но вы не должны отображать какую-либо информацию о коде javascript, поскольку есть момент, когда вы собираетесь взять этот js и поместить его в сжатый файл, или переместить, или использовать повторно это и будет очень сложно сделать, если вы отобразили значения переменных таким образом.

надеюсь, это поможет!