Как управлять модулями Javascript в шаблонах django?

Предположим, нам нужна библиотека функциональных возможностей, основанных на javascript (я думаю, jquery): Например:

  • диалоговое окно ajax
  • выбор даты
  • средство проверки формы
  • скользящая панель меню
  • гармоничная вещь

Для каждого из них есть четыре части кода: некоторые Python, CSS, JS и HTML.

Каков наилучший способ организовать все эти части, чтобы:

  • каждый модуль javascript может быть аккуратно повторно использован разными представлениями
  • четыре бита кода, которые составляют завершенную функцию, остаются вместе
  • детали css/js/html отображаются в их правильных местах в ответе
  • общие зависимости между модулями не повторяются (например, общий файл javascript)

х --------------

Было бы неплохо, если бы или есть какой-то способ гарантировать, что при вызове из templatetag шаблоны соблюдали директивы {% block%}. Таким образом, можно создать единый шаблон с блоком каждый для CSS, HTML и JS в одном файле. Вызовите это через templatetag, который вызывается из шаблона того, что хочет его просмотр. Это имеет смысл. Может быть, это уже сделано? Мои шаблоны templatetag, похоже, игнорируют директивы {% block%}.

х --------------

Там есть очень актуальная информация о размещении таких носителей в формах http://docs.djangoproject.com/en/dev/topics/forms/media/, которые, вероятно, применимы к примерам проверки формы и выбора даты.

Ответы

Ответ 1

Прошло некоторое время с тех пор, как я опубликовал эту проблему. Что я делал, чтобы решить это:

  • напишите части javascript, которые вам понадобятся, в качестве библиотеки, которая подается статически
  • вызовите подпрограммы в статической библиотеке из шаблона со значениями на стороне сервера

Требуется ограничение, чтобы написать его таким образом, что он действует только на стороне клиента script; не испытывайте соблазна попробовать и ввести значения с сервера во время обслуживания js. В конечном итоге я счел менее запутанным применять серверные переменные строго в html-шаблоне.

Таким образом я могу:

  • сохраняйте javascript-селекторов в тегах html внутри одного и того же файла (например: шаблон)
  • вообще избегать templatetags
  • повторно использовать каждую библиотеку javascript в разных местах и ​​
  • сохраните фрагменты css/js/html во всех местах, где их ожидали найти

Это не идеально, но это заставляет меня до тех пор, пока не придет новая идея.

Например, библиотека js в "media/js/alertlib.js" может включать в себя:

function click_alert(selector, msg){ 
    $(selector).click(function(){ alert(msg) })
}

и шаблон имеет:

<script type="text/javascript" src="media/js/alertlib.js"></script>
<script type="text/javascript">
    click_alert('#clickme', {% message %})
</script>

<div id='clickme'>Click Me</div>

Ответ 2

Если более чем одна страница использует данный JS файл, вы должны рассмотреть возможность объединения всех из них и сведения результата. Это уменьшает количество сетевых подключений, что улучшит общее время загрузки страницы. Не забудьте указать время истечения срока действия, по крайней мере, на неделю или две.

Ответ 3

Посмотрите Django Sekizai, который был создан именно для этой цели.

Ответ 4

Думаю, вам нелегко сохранить все четыре части вместе и применить их падающим махом - просто потому, что некоторые появляются в тегах <head> и других в тегах <body>.

Что сделано, убедитесь, что jQuery загружен для всех страниц моего base.html (а также моего базового файла css)... тогда у меня есть блокированные теги для {% block css %} и {% block js %}. Шаблоны, наследующие файл base.html, могут предоставлять свои собственные javascript и css (и только те вещи, которые необходимы).

Я создал теги шаблонов, которые создают функции ajax, выход которых основан на отображаемом объекте (например, включая object_id) - который сокращает повторное кодирование.

Одна вещь, которую я не пробовал, но меня интересует django-compress.