2019-09-06 dataTable

dataTable html：

                    <div class="box-body">
                        <div class="table-responsive">
                            <table class="table no-margin" id="data-table" >
                                <thead>
                                <tr>
                                    <th>井号</th>
                                    <th>管号</th>
                                    <th>下管时间</th>
                                </tr>
                                </thead>
                                <tbody>
                                <!-- {% for i in "x"|ljust:"15" %}
                                    <tr>
                                        <td>OR9842</td>
                                        <td>{{ forloop.counter }}</td>
                                        <td>2019-03-15 16:{% widthratio forloop.counter 1 5  %}:02</td>
                                    </tr>
                                {% endfor %} -->
                                </tbody>
                            </table>
                        </div>
                        <!-- /.table-responsive -->
                    </div>

js:

var table = $('#data-table').DataTable({
    'paging': true,
    // 分页风格，full_number 会在后端只传过来一页数据的情况下把所有页码显示出来
    'sPaginationType': "full_numbers",
    'processing': true, //是否显示加载
    // 没有使用原生 DataTable 搜索功能，添加定制化搜索条件，
    'serverSide': true, //开启服务器处理模式
    // 刷新页面不跳转回第一页, 但是不能改变 ajax.reload 回第一页，reload 回第一页解决方法见第一行
    "bStateSave": true,
    // 发送post请求
    'ajax': {
        'type': 'POST',
        'url': "{% url 'web:device_data' %}",
        // 自定义搜索内容
        'data': function (d) {
            d.id = GetUrlParam("id");
        }
    },
    // 不允许用户改变每页数量
    'lengthChange': false,
    // 自定义了搜索框
    'searching': false,
    // 服务器端分页，不要排序了
    // 'ordering': false,
    // "columnDefs": [
    //     {"orderable": false, "targets": 0}
    // ],
    // "order": [[1, "desc"]],
    // 'info': true,
    'autoWidth': true,
    // 'pageResize': true,  // enable page resize
    'iDisplayLength': 15, // 每页数量
    "aoColumns": [
        {
            "mData": "well_number"
        },
        {
            "mData": "pipe_number"
        },
        {
            "mData": "time"
        }
    ],
    "language": {
        // "lengthMenu": "每页 _MENU_ 条记录",
        "zeroRecords": " ",
        // "info": "当前 _START_ 条到 _END_ 条 共 _TOTAL_ 条",
        // "infoEmpty": "无记录",
        // "infoFiltered": "(从 _MAX_ 条记录过滤)",
        // "search": "用户",
        "processing": "载入中。。。",
        "paginate": {
            "first": "<<",
            "previous": "<",
            "next": ">",
            "last": ">>"
        },
        "info": "",
        // "info": "<button class=\"btn btn-default hidden-xs\" id=\"mark_as_downloaded\"><i class=\"fa fa-envelope-open-o\"></i> 标记为已下载</button>&nbsp; &nbsp;\n" +
        //     "<button class=\"btn btn-default hidden-xs\" id=\"mark_as_not_downloaded\"><i class=\"fa fa-envelope-o\"></i> 标记为未下载</button> &nbsp; &nbsp;\n" +
        //     "<button class=\"btn btn-default hidden-md hidden-sm hidden-xs\" id=\"refresh\"><i class=\"fa fa-refresh\"></i> 刷新</button> &nbsp; &nbsp;\n" +
        //     "<span class=\"hidden-sm hidden-xs\">当前 _START_ 条到 _END_ 条 共 _TOTAL_ 条</span>",
        // "sInfoEmpty": ""
    },
});

dataTeble 表单共提交了如下数据(为了简单，所有的排序和搜索都没有关闭，但是本例中没有用到)：

draw: 1
columns[0][data]: well_number
columns[0][name]: 
columns[0][searchable]: true
columns[0][orderable]: true
columns[0][search][value]: 
columns[0][search][regex]: false
columns[1][data]: pipe_number
columns[1][name]: 
columns[1][searchable]: true
columns[1][orderable]: true
columns[1][search][value]: 
columns[1][search][regex]: false
columns[2][data]: time
columns[2][name]: 
columns[2][searchable]: true
columns[2][orderable]: true
columns[2][search][value]: 
columns[2][search][regex]: false
order[0][column]: 0
order[0][dir]: asc
start: 0
length: 15
search[value]: 
search[regex]: false
id: 1

对于我而言，只用到了 start 和 id 两个参数即可：
django 后台(只是顺手写写，是不规范的，分页应该用 paginator，而不是这么简单粗暴)

@csrf_exempt
# @login_required(login_url='/login/')
def get_device_data(request):
    if request.method == "POST":
        pagination = dict()
        device_id = request.POST.get("id")
        start = request.POST.get('start')
        try:
            start = int(start)
            start = 0 if start < 0 else start
        except (TypeError, ValueError):
            start = 0
        device_queryset = DeviceData.objects.filter(device__id=device_id).all()
        end = start + settings.ITEM_NUM_PER_PAGE if start + settings.ITEM_NUM_PER_PAGE < device_queryset.count() else device_queryset.count()
        device_data = device_queryset[start: end]
        device_data = list(device_data.values('id', 'well_number', 'pipe_number', 'time'))
        response = dict()
        response["recordsTotal"] = device_queryset.count()
        response["recordsFiltered"] = device_queryset.count()
        response["data"] = device_data
        return JsonResponse(response)