Can you help me with the table view?

I created a datatable code for user list. But it only show json result not in datatable format. Can you help me find why it is not redirect to the datatable format?
#urls.py

urlpatterns = [
    url(r'^data/$', login_required(UserListJson.as_view()), name='User_list'),
]

#View
class UserListJson(BaseDatatableView):
    model = Useril
    columns = ['nb_id', 'first_name', 'last_name', 'born_at']
    order_columns = ['nb_id', 'first_name', 'last_name', 'born_at']
    max_display_length = 50000
    template_name = 'viewUser/User_list.html'

    def render_column(self, row, column):
        # We want to render user as a custom column
        if column == 'nb_id':
            # escape HTML for security reasons
            return escape('{0} {1}'.format(row.first_name, row.last_name))
        else:
            return super(UserListJson, self).render_column(row, column)

    def filter_queryset(self, qs):
        # use parameters passed in GET request to filter queryset

        # simple example:
        search = self.request.GET.get(u'search[value]', None)
        if search:
            qs = qs.filter(name__istartswith=search)

        # more advanced example using extra parameters
        filter_customer = self.request.GET.get(u'nb_id', None)

        if filter_customer:
            customer_parts = filter_customer.split(' ')
            qs_params = None
            for part in customer_parts:
                q = Q(customer_firstname__istartswith=part) | Q(customer_lastname__istartswith=part)
                qs_params = qs_params | q if qs_params else q
            qs = qs.filter(qs_params)
        return qs

# viewUser/User_list.html
{% extends "base.html" %}
{% load i18n staticfiles %}

{% block extra_head %}
    <link rel="stylesheet" type="text/css" href="//cdn.datatables.net/1.10.12/css/jquery.dataTables.css">
    <script type="text/javascript" charset="utf8" src="//cdn.datatables.net/1.10.12/js/jquery.dataTables.js"></script>
    <script src="{% static "ddv_example/ddv_example_1_10.js" %}"></script>
    <script type="text/javascript">
        var USERS_LIST_JSON_URL = '{% url "VoterListJson" %}';
        // translations for datatables

        var dt_language = {
            "emptyTable":     "{% trans "No data available in table" %}",
            "info":           "{% trans "Showing _START_ to _END_ of _TOTAL_ entries" %}",
            "infoEmpty":      "{% trans "Showing 0 to 0 of 0 entries" %}",
            "infoFiltered":   "{% trans "(filtered from _MAX_ total entries)" %}",
            "infoPostFix":    "",
            "thousands":      ",",
            "lengthMenu":     "{% trans "Show _MENU_ entries" %}",
            "loadingRecords": "{% trans "Loading..." %}",
            "processing":     "{% trans "Processing..." %}",
            "search":         "{% trans "Search:" %}",
            "zeroRecords":    "{% trans "No matching records found" %}",
            "paginate": {
                "first":      "{% trans "First" %}",
                "last":       "{% trans "Last" %}",
                "next":       "{% trans "Next" %}",
                "previous":   "{% trans "Previous" %}"
            },
            "aria": {
                "sortAscending":  "{% trans ": activate to sort column ascending" %}",
                "sortDescending": "{% trans ": activate to sort column descending" %}"
            }
        }
    </script>
{% endblock %}

{% block content %}
    <table class="datatable">
        <thead>
            <th>{% trans "nb_id" %}</th>
            <th>{% trans "first_name" %}</th>
            <th>{% trans "last_name" %}</th>
        </thead>
        <tbody>
        </tbody>
    </table>
{% endblock %}
Comments (1)
