Метка: jQuery

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

в urls.py
```
(r'^ajax/categ/$', 'proj.list.views.feeds_subcat'),Code language: Python (python)
```
во Вьюхе
```
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")Code language: Python (python)
```
Примерно рассказываю что там происходит
В модели SubCategory выбираем имя субкатегории, которая соответствует ид_категории, что к нам привалило.
всё это оборачиваем в JSON попутно подгружаем библиотеки для этих дел.
и отправляем прямо в формате js всё обратно.

теперь создаём ещё один js файл называем его как душе угодно (и не забываем подключить)
```
<script src="/static/js/categ.js" type="text/javascript"></script>Code language: HTML, XML (xml)
```
```
  $(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');
    })
  })Code language: JavaScript (javascript)
```
Что он делает?
находит элемент select с id = «id_categ»
При изменении которого вызывает функцию $.getJSON, которая долбится по урле /ajax/categ/ гет запросом и параметром ?id=то_что_выбрано
Если всё отлично выполняется функция j
Которая и меняет значение во втором селекте.
#id_categ — ИД_селекта категории
#id_sub — ИД_селекта подкатегории
19 февраля 2011
Django ajax пример ( django ajax autocomplite)
Продолжаю понемногу разбираться в Django

Дошло до авто заполнения полей, пару дней перечитывал все «Интернеты» о разных вариантах и методах, о готовых примерах и т.п.

И так начнём я воспользовался jQuery плагином Autocomplete
~~Всё это я брал вот тут~~
Плагин совсем не полный ищет так себе похоже просто старый.
Поэтому идём и берём самый новый ..

~~тут оно будет работать без основного jQuery~~

Но на других страницах проекта, есть более полные версии и более красивые.
Вот их и качаем
Из них нам нужны
в папочку css кидаем
```
indicator.gif
jquery.autocomplete.cssCode language: HTML, XML (xml)
```
в папочку js кидаем
```
jquery-1.5.min.js
jquery.autocomplete.min.jsCode language: HTML, XML (xml)
```
Поехали, предположим, что у нас есть в urls.py
```
(r'^asearch/$', 'man.views.ajax_search'),Code language: Python (python)
```
man.views.ajax_search — я думаю рассказывать не надо, что это своё приложение и Вьюха его

во views.py
```
def ajax_search(request):
     if request.method == 'GET':  
         GET = request.GET  
         if GET.has_key('q'):
             q = request.GET.get( 'q' )
             search = Task.objects.all()
             results = search.filter(name__contains = q)
             matches = ""
             for result in results:
                 matches = matches + "%s\n" % (result.name)
             return HttpResponse(matches, mimetype="text/plain") 
 Code language: Python (python)
```
В данном примере мы будет общаться через обычный get запрос.
Можно сделать «не обычным»
например так
```
if request.is_ajax():
q = request.GET.get( 'q' )Code language: Python (python)
```
Но об этом попробую ещё написать, когда буду более тонко в этом разбираться
В модели Task мы делаем поиск по полю «name».
Потом всё это выстраиваем в красивый список с переносами строк
в итоге в переменной matches у нас будет уже структурированный список.

Теперь на стороне клиента.

Во первых подключаем плагин со стилями и jquery
```
<script src="/static/js/jquery-1.5.min.js" type="text/javascript"></script>
<script src="/static/js/jquery.autocomplete.min.js" type="text/javascript"></script>
<link type="text/css" rel="stylesheet" href="/static/css/jquery.autocomplete.css">Code language: HTML, XML (xml)
```
Добавим простую функцию jQ
```
<script type="text/javascript">
   $(document).ready(function() {  
       $("#q1").autocomplete("/asearch/");  
    });  
</script>Code language: HTML, XML (xml)
```
Тут мы говорим плагину: находим элемент с id=»q1″ и будем с ним работать.
А всё запросы отправлять на урл «/asearch/»

дальше собственно сам элемент
```
<input id="q1" type="text" />Code language: HTML, XML (xml)
```
Вот собственно и всё.
18 февраля 2011

Метка: jQuery

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

Django ajax пример ( django ajax autocomplite)