自定义查询上的jquery数据表生成答案

【问题标题】：jquery datatable generation on custom query自定义查询上的jquery数据表生成
【发布时间】：2011-03-27 05:29:37
【问题描述】：

我一直在摸不着头脑，我一直在使用 jquery datatable http://www.datatables.net 来显示数据库中的记录。

我一直在使用内置的搜索字段，但它是一个字段。

我想做一个报告类型搜索，例如显示给定开始和结束日期之间的所有订单、由谁订购、订单分配到的工厂等。我想显示基于多个输入的表格，这些输入可用于构建查询以生成报告。

所以，当我在搜索字段中输入搜索参数并根据返回的结果重新绘制表格时，我的想法是有几个表单字段的表单。

我想知道如何从表单字段发送数据，以便生成查询并返回响应并重绘表格。

下面是我一直在使用的代码示例

` /初始化数据表/

        $('#second_tab_table').dataTable( {
            "bProcessing": true,
            "bServerSide": true,
            "sAjaxSource": "components/report/report_processing.php?status=displayOrderReport",
            "bJQueryUI": true,
            "bStateSave": true,
            "bAutoWidth": false,
            "sPaginationType": "full_numbers"
        } );`

我还查看了自定义过滤http://www.datatables.net/examples/plug-ins/range_filtering.html，但这并不能达到目的。

我将不胜感激任何帮助。

这样解决了：

` $(document).ready(function() {

        /*Initialize the data table*/
        $('#second_tab_table2').dataTable( {
            "bProcessing": true,
            "bServerSide": true,
            "sAjaxSource": "components/report/report_processing.php?status=displayOrderReport&sid=<?php echo $_REQUEST['sid']; ?>",
            "bJQueryUI": true,
            "bStateSave": true,
            "bAutoWidth": false,
            "sPaginationType": "full_numbers"
        } );


         $("#oc_id").live("change", function() {

            var data = $("#formulario_personal").serialize();
            var dataString = 'oc_id=8&status=displayOrderReport&'+ data;
           $.ajax({                           
                    type: "POST",
                   url: "components/report/report_processing.php",
                    data: dataString,
                    cache:false,
                    success: function(html){;
                            var oTable = $('#second_tab_table').dataTable();
                            oTable.fnDraw();
                    }
                });
        });


});`

似乎这会起作用： http://www.datatables.net/examples/server_side/custom_vars.html

【问题讨论】：

您应该将您的解决方案放在您自己问题的答案中，并将其标记为正确，以便该问题从“未回答”列表中消失：) 谢谢。

标签： jquery datatables

【解决方案1】：

正确的方法是覆盖fnServerData 或fnServerParams。

这取决于版本 - 所以您需要确保您使用的是正确的版本。我认为fnServerData 更好地支持旧版本。所以我将展示有关它的示例。

这个函数是well documented。这是usage example。

从他们的示例中，看看他们如何使用aoData.push 语句将数据添加到查询中。我正在使用它，它对我很有效。所以如果你有更多的问题，请告诉我。

$(document).ready(function() {
    $('#example').dataTable( {
        "bProcessing": true,
        "bServerSide": true,
        "sAjaxSource": "../examples_support/server_processing.php",
        "fnServerData": function ( sSource, aoData, fnCallback ) {
            /* Add some extra data to the sender */
            aoData.push( { "name": "more_data", "value": "my_value" } );
            $.getJSON( sSource, aoData, function (json) { 
                /* Do whatever additional processing you want on the callback, then tell DataTables */
                fnCallback(json)
            } );
        }
    } );
} );

【讨论】：