如何正确加载使用JQuery数据表从Web方法的数据？ [英] How to correctly reload data from web method using JQuery DataTables?

问题描述

我使用jQuery 数据表插件以我的表工作，最近我切换到服务器端分页和过滤。特别是，我有一个Web方法返回的数据填充客户表：

I'm using JQuery DataTables plug-in to work with my tables and recently I switched to server-side pagination and filtering. In particular, I have a web method that return data to populate customers table:

    [WebMethod]
    [ScriptMethod(ResponseFormat = ResponseFormat.Json)]
    public string GetCustomers(string jsonAOData, int mode)
    {
        // ...
    }

在我的网页我用这个code检索数据通过AJAX调用。

and in my page I use this code to retrieve data via AJAX calls.

var grid = $('#grid').dataTable({
        bJQueryUI: true,
        bLengthChange: false,
        iDisplayLength: listItemsPerPage,
        bDestroy: true,
        "bProcessing": true,
        "bSort": true,
        "sPaginationType": "full_numbers",
        "bServerSide": true,
        "sAjaxSource": "/wsData/GetData.asmx/GetCustomers",
        "fnServerData": function (sSource, aoData, fnCallback) {

            var jsonAOData = JSON.stringify(aoData);

            $.ajax({
                //dataType: 'json', 
                contentType: "application/json; charset=utf-8",
                type: "POST",
                url: sSource,
                data: "{jsonAOData : '" + jsonAOData + "', mode:'0'}",
                success: function (msg) {
                    fnCallback(JSON.parse(msg.d));
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    alert(XMLHttpRequest.status);
                    alert(XMLHttpRequest.responseText);
                }
            });
        },
        "aoColumnDefs": [
            // my columns structure
        ]
    });

正如你所看到的，我传递到Web方法两个参数： jsonAOData ，所有的信息，分页和过滤，以及模式，定义如何从数据库获取数据。
它完美地工作，但现在我需要在我的表中的数据reaload传递给我的web方法不同的值模式。

As you can see, I'm passing to the web method two parameters: jsonAOData, with all the information for pagination and filtering, and mode, that defines how to fetch data from DB. It works perfectly, but now I need to reaload data in my table passing to my web method a different value for mode.

阅读文档，我发现 fnReloadAjax（） 功能可以帮助我，但我不能找到将它应用到我的问题的正确方法。

Reading docs I found fnReloadAjax() function could help me, but I cannot find the correct way to apply it to my problem.

我想是这样的：

grid.fnReloadAjax("/wsData/GetData.asmx/GetCustomers?mode=1");

但简化版，它的工作。你可以帮我吗？我哪里做错了吗？

but it does't work. Can you help me? Where I'm doing wrong?

如何通过新的参数，我的网络的方法是什么？

推荐答案

我发现 fnReloadAjax（）不工作对我这么好。
所以，以下一些论坛，我决定使用 fnDraw（）。

I discovered fnReloadAjax() doesn't work so good for me. So following some forums I decided to use fnDraw().

我定义一个全局变量模式，我根据我的数据要恢复稳定物价。
然后，我调用 fnDraw（）。从Web方法表被重新绘制加载数据

I defined a global variable mode that I valorize according to data I want to retrieve. Then I invoke fnDraw(). The table is re-drawn loading data from the web method.

在AJAX调用我设置：

In AJAX call I set:

data: "{jsonAOData : '" + jsonAOData + "', mode:'" + mode +"'}",

这篇关于如何正确加载使用JQuery数据表从Web方法的数据？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！