Связанные списки select в django (ajax select linked)


Потратив часа 3 на поиск рабочего решения связанных полей (Это когда в зависимости от категории нужно показывать под категорию) спешу поделиться чтоб не забыть

в urls.py

(r'^ajax/categ/$', 'proj.list.views.feeds_subcat'),

во Вьюхе

def feeds_subcat(request):
    from django.core import serializers
    json_subcat = serializers.serialize("json", SubCategory.objects.filter(category_name=request.GET['id']))
    return HttpResponse(json_subcat, mimetype="application/javascript")

Примерно рассказываю что там происходит
В модели SubCategory выбираем имя субкатегории, которая соответствует ид_категории, что к нам привалило.
всё это оборачиваем в JSON попутно подгружаем библиотеки для этих дел.
и отправляем прямо в формате js всё обратно.

теперь создаём ещё один js файл называем его как душе угодно (и не забываем подключить)

<script src="/static/js/categ.js" type="text/javascript"></script>
  $(function(){
    $("select#id_categ").change(function(){
      $.getJSON("/ajax/categ/",{id:+$(this).val()}, function(j) {
        var options = '<option value="">---------- </option>';
        for (var i = 0; i < j.length; i++) {
          options += '<option value="' + parseInt(j[i].pk) + '">' + j[i].fields['name'] + '</option>';
        }
        $("#id_sub").html(options);
        $("#id_sub option:first").attr('selected', 'selected');
        $("#id_sub").attr('disabled', false);
      })
      $("#id_categ").attr('selected', 'selected');
    })
  })

Что он делает?
находит элемент select с id = «id_categ»
При изменении которого вызывает функцию $.getJSON, которая долбится по урле /ajax/categ/ гет запросом и параметром ?id=то_что_выбрано
Если всё отлично выполняется функция j
Которая и меняет значение во втором селекте.
#id_categ — ИД_селекта категории
#id_sub — ИД_селекта подкатегории

  1. Дмитрий

    Спасибо, очень просто излагаете.
    Но есть момент, после перерисовки окна, событие не вызывается и в подслекторе уже содержится не то, что хотелось бы.

  2. расскажите о django-ajax-selects, пожалуйста

  3. Попробовал по примеру. Но почему то ничего не срабатывает. Создал селекты с указанными йд. Можете как у Вас в шаблоне это выглядит?

Оставить комментарий


Примечание - Вы можете использовать эти HTML tags and attributes:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">