jQuery和Datatables fnServerParam没有表现出任何爱：/

I have a simple form with a single button and a datatable with a bunch of data. When the user selects one of the options I want the datatable to refresh the data by passing an kwarg - that being value of the selection, which will reduce the data size..

我有一个简单的表单,只有一个按钮和一个包含大量数据的数据表。当用户选择其中一个选项时,我希望数据表通过传递一个kwarg刷新数据 - 这是选择的值,这将减少数据大小。

My Question:

How do I use fnServerParams to make this cleaner??

如何使用fnServerParams来使这个更干净?

My basic select.

我的基本选择。

<div class="span-15 last"><select name="customer" id="id_customer">
    <option value="" selected="selected">---------</option>
    <option value="1">A</option>
    <option value="2">B</option>
    <option value="4">C</option>
</select></div>

And the corresponding js.

和相应的js。

<link rel="stylesheet" href="{{STATIC_URL}}css/datatable.css" />
<script type="text/javascript" src="{{STATIC_URL}}js/jquery.dataTables.min.js"></script>
<script style="text/javascript">
    $(document).ready(function() {

        $('#data_table').dataTable({
            'sPaginationType':'full_numbers',
            'sDom': '<lf><"clear">rt<"bottom"<"tpad"i<"clear"p>>>',
            "bProcessing": true,
            "sAjaxSource": "{% url incentive_distribution_homes_ajax_list %}"
        });

        $('#id_customer').change(function () {
            var builder_id =  $(this).val();

            //fix this using fnServerParam??

            $('#data_table').dataTable({
                "bDestroy":true,
                'sPaginationType':'full_numbers',
                'sDom': '<lf><"clear">rt<"bottom"<"tpad"i<"clear"p>>>',
                "bProcessing": true,
                "sAjaxSource": "{% url incentive_distribution_homes_ajax_list %}",
                "fnServerData": function ( sSource, aoData, fnCallback ) {
                    $.ajax( {
                            "dataType": 'json',
                            "type":"GET",
                            "url": sSource,
                            "data" : { 'builder_id': builder_id } ,
                            "success": fnCallback
                    })
                }
            });
        });

1 个解决方案

#1

This is what I would do:

这就是我要做的:

I would create another javascript object to act as a listener on #id_customer, configure it such that if the DOM changes, it will call datatables (or the appropriate function therein.)

我将创建另一个javascript对象作为#id_customer上的侦听器,配置它使得如果DOM更改,它将调用datatables(或其中的相应函数)。

From there, to get the data you want passed along to the server, use "fnServerParams", and extract the value you want to pass along from the DOM.

从那里,要获取要传递到服务器的数据,请使用“fnServerParams”,并从DOM中提取要传递的值。

Docs are here on that variable, as well as examples:

文档在这个变量上,以及示例:

http://datatables.net/release-datatables/examples/server_side/custom_vars.html

Once you pass that along, you will need to catch it on the server side (but not in the URLs, you shouldn't have to add additional parameters there.) Just look for "fnServerParams" in the request.GET.

一旦你传递它,你需要在服务器端捕获它(但不是在URL中,你不必在那里添加其他参数。)只需在request.GET中查找“fnServerParams”。

(and for what its worth, you can use django_datables to solve this)

(为了它的价值,你可以使用django_datables来解决这个问题)

#1