пятница, 28 апреля 2017 г.

Select2 ajax запрос к Django rest framework

При использование select  нужно будет подгружать для option много данных. Выход есть - использовать альтернативу -  select2.
Далее, привожу пример AJAX подгрузки данных для select2 из django rest framework

{% block javascript %}
  <script>
    $(document).ready(function() {
      $("#select-person").select2({
        language: "ru",
        placeholder: "Введите ФИО человека",
        ajax: {
          url: "/api/company/people/", //drf url для people
          dataType: 'json',
          delay: 300,
          data: function (params) {
            return {
              name: params.term, //name - api поле для поиска, params.term - данные из поля поиска
              //page: params.page
            };
          },
          processResults: function (data, params) {
            params.page = params.page || 1;
            //console.log(data.results); //drf возвращает данные в results
            //console.log(data.count); //drf возвращает количество записей в count
            return {
              results: data.results, //берем из json ответа results
              pagination: {
                more: (params.page * 30) < data.count
              }
            };
          },
          cache: true
        },
        //debug: true,
        escapeMarkup: function (markup) { return markup; }, // let our custom formatter work
        minimumInputLength: 1, //минимальное количество символов для запроса
        templateResult: function(results) {
          return results.name; //берем для select option поле модели - name
        },
        templateSelection: function(results) {
          return results.name || results.text;
        }
      });
    });
  </script>
{% endblock %}
 
{% block body %}
  <select class="form-control" id="select-person">
    <!--
    <option value="" selected="selected"></option>
    -->
  </select>
{% endblock %}


Для django также имеется django-select2 и django-easy-select2

Комментариев нет:

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

django-oscar tinymce 4 filebrowser

Задача: в дашборде django-oscar загружать изображения 1. Установка django-filebrowser-no-grappelli - Открываем проект, загружаем виртуа...