Django. Sorting queryset with ajax

list.jinja

<!--Article sorting for Ajax-->
<select title="{{ _('Select sort param') }}" class="selectpicker" id="sort"
      data-url="{{ url('articles:sort') }}">
  <option value="-create_date" data-icon="glyphicon glyphicon-arrow-up">
      {{ _('Date') }}
  </option>
  <option value="create_date" data-icon="glyphicon glyphicon-arrow-down">
      {{ _('Date') }}
  </option>
  <option value="-rate" data-icon="glyphicon glyphicon-arrow-up">
      {{ _('Rate') }}  <span class="glyphicon glyphicon-arrow-up"></span>
  </option>
  <option value="rate" data-icon="glyphicon glyphicon-arrow-down">
      {{ _('Rate') }} <span class="glyphicon glyphicon-arrow-down"></span>
  </option>
</select>

partial_article.html

<!-- Article template for home page -->
{% load i18n %}
{% for article in articles %}
    <div class="article" id="article-{{ article.id }}">

        <a href="{{ article.get_absolute_url }}" class="h1">
            {{ article.title }}
        </a>
        <hr>

        {% include 'articles/partial/partial_article_meta.html' %}

        <div class="short-description">

            <p>
                {% if article.short_description %}
                    <img src="{{ article.images.first.image.url }}" alt="" class="img-responsive" style="margin-bottom: 5px">
                    {{ article.short_description| safe }}
                {% else %}
                    {{ article.get_summary| safe }}
                {% endif %}
            </p>

        </div>

        <div class="container">

            <div class="read-more">
                <a href="{{ article.get_absolute_url }}">
                    {% trans "Read more" %}
                </a>
            </div>

        </div>

        <!--Если статьи пренадлежат текущему пользователю, открываем кнопки "Редактировать" и "Удалить" -->
        {% if article in user_articles %}

            <div class="edit-panel">

                <a class="btn btn-info" href="{% url 'articles:update' article.slug %}">
                    <i class="fa fa-pencil"></i>
                    {% trans "Edit" %}
                </a>

                <!--Задаем уникальный id для каждого модального окна-->
                <a href=""
                   data-toggle="modal"
                   data-target="#article-{{ article.id }} .deleteModal"
                   class="btn btn-danger"><i class="fa fa-remove"></i>
                    {% trans "Delete" %}
                </a>

                <!--Модальное окно для удаления статей на главной странице-->
                {% include 'articles/delete_modal.html'%}

            </div>

        {% endif %}
    </div>
{% empty %}

    <h1>
        {% trans "Nothing to show" %}
    </h1>

{% endfor %}

script.js

 // ajax request for sorting articles
    $('#sort').on('change', function() {
        var sortid = $('#sort').val();
        $.ajax({
            type: "GET",
            url: $(this).data('url'),
            data: {'sortid': sortid}
        }).done(function (data) {
            $('#articles').html(data.html_article_list);
        });
    });

urls.py

url(r'^sort/$', class_views.ArticleListView.as_view(), name='sort'),

views.py

# get method in ListView

def get(self, request, *args, **kwargs):
        # sorting articles by date and rating with ajax
        data = {}
        if request.is_ajax():
            qs = self.get_queryset()
            sort_param = request.GET.get('sortid')
            if sort_param in ('create_date', '-create_date', 'rate', '-rate'):
                qs = qs.order_by(sort_param)[:100]
            data['html_article_list'] = render_to_string(
                template_name='articles/jinja2/partial/partial_article.jinja.html',
                context={'articles': qs},
                request=request)
            return JsonResponse(data)
        return super().get(request, *args, **kwargs)

How do you join the two templates together like do u call the list.jinja in the partical_artical, and also which template is the script for