Search code examples
jqueryajaxdjangohrefdjango-endless-pagination

Filtering with Django endless pagination


This question has been asked by other people previously and no answers where provided. Effectively, the goal is to implement search functionality with Django's Twitter-style endless pagination. A user modifies some interface field, and the endless table re-initializes taking into account new user inputs.

I have a template A which is the main template containing embedded template B that serves as container for my endless table. The table loads addition data as the user scrolls down:

<select id = 'parameter' class="form-control input-sm">
    <!-- my options -->
</select>
<table>
   <thead>...</thead>
   <tbody>
         {% include 'my_app/template_B.html' %}
   </body>
</table>

The structure of template B seems to be irrevelant to the question, so let me omit it.

The Django view which initializes template A:

def my_view(request,\
            parameter_id = None,
            template='order_scheduler/template_A.html',\
            extra_context=None):
if parameter_id is None:
   # do smth
else:
   # do smth
return render_to_response(template,
                          context,
                          context_instance=RequestContext(request)): 

The question: How do I reinitialize the endless table in template B when the user modifies the value of parameter combobox without refreshing template A?


Solution

  • You could create a view that renders template_B.html according to the parameter passed in POST, then in your page:

        $(function() {
            var parameter = $('#parameter');
            parameter.on('change', function() {
                $.post("/your/viev/url", {'parameter': parameter.val()}, function(response) {
                    $('tbody').html(response);
                });
            });
        });