Question

我是asp.net开发人员，但初学者是jquery dataTable。我在dataTable中遇到问题。我的aspx页面中有一个dataTable（DiscountDataTable）。当页面在浏览器中加载时，它会给出以下异常。我用Google搜索了很多，但无法得到满意的答案。提前致谢

oSettings is null
var nOrig = oSettings.nTableWrapper.parentNode;

这是我的dataTable ASPX代码：

<table id="DiscountDataTable" class="table table-bordered table-hover table-striped tblFormatd">
                            <thead>
                                <tr>
                                    <th>
                                        <asp:Label ID="Label76" runat="server" Text="<%$Resources:resource,Sno %>"></asp:Label></th>
                                    <th>
                                        <asp:Label ID="Label77" runat="server" Text="<%$Resources:resource,campus %>"></asp:Label></th>
                                    <th>
                                        <asp:Label ID="Label78" runat="server" Text="<%$Resources:resource,name %>"></asp:Label></th>
                                    <th>
                                        <asp:Label ID="Label79" runat="server" Text="<%$Resources:resource,description %>"></asp:Label></th>
                                    <th>
                                        <asp:Label ID="Label80" runat="server" Text="<%$Resources:resource,action %>"></asp:Label></th>
                                </tr>
                            </thead>
                        </table>

C＃代码：

[WebMethod]
    [ScriptMethod(UseHttpGet = true)]
    public static object GetDiscountBycampus(int CampusId)
    {
        HttpContext Context = HttpContext.Current;
        jQueryDataTableParamModel param = new jQueryDataTableParamModel();
        param.sEcho = String.IsNullOrEmpty(Context.Request["sEcho"]) ? 0 : Context.Request["sEcho"].ToInt32();
        param.sSearch = String.IsNullOrEmpty(Context.Request["sSearch"]) ? "" : Context.Request["sSearch"];
        param.iDisplayStart = String.IsNullOrEmpty(Context.Request["iDisplayStart"]) ? 0 : Context.Request["iDisplayStart"].ToInt32();
        param.iDisplayLength = String.IsNullOrEmpty(Context.Request["iDisplayLength"]) ? 0 : Context.Request["iDisplayLength"].ToInt32();
        var sortColumnIndex = Convert.ToInt32(Context.Request["iSortCol_0"]);
        var sortDirection = Context.Request["sSortDir_0"]; // asc or desc

        List<ClsDiscount> GetList = new List<ClsDiscount>();
        IEnumerable<ClsDiscount> filteredDiscount;
        ClsDiscount obj = new ClsDiscount();

        GetList = obj.DiscounttGelAll(CampusId);

        if (!string.IsNullOrEmpty(param.sSearch))
        {
            filteredDiscount = GetList
               .Where(c => c.Name.ToLower().Contains(param.sSearch.ToLower()));
        }
        else
        {
            filteredDiscount = GetList;
        }


        var result = filteredDiscount.Select(c => new
        {
            RowNo = c.RowNo,
            DiscountId = c.DiscountId,
            CampusName = c.CampusName,
            Description = c.Description,
            Name = c.Name,
        }).Skip(param.iDisplayStart).Take(param.iDisplayLength);

        var data = new
        {
            sEcho = param.sEcho,
            iTotalRecords = result.Count(),
            iTotalDisplayRecords = filteredDiscount.Count(),
            aaData = result
        };
        return data;
    }

js代码：

 GetDiscountDataTable = function (id) {
            var oTable = $('#DiscountDataTable').dataTable({
                "bJQueryUI": true,
                "sPaginationType": "full_numbers",
                "bServerSide": true,
                "bRetrieve": true,
                "bDestroy": true,
                "sAjaxSource": "/forms/Setup/Setup.aspx/GetDiscountBycampus?CampusId=" + id,
                "fnServerData": function (sSource, aoData, fnCallback) {
                    $.ajax({
                        "type": "GET",
                        "dataType": 'json',
                        "contentType": "application/json; charset=utf-8",
                        "url": sSource,
                        "data": aoData,
                        "success": function (data) {
                            fnCallback(data.d);
                        }
                    });
                },
                "aoColumns": [
                             {
                                 "mDataProp": "RowNo",
                                 "bSearchable": false,
                                 "bSortable": false,
                                 "sWidth": "20"
                             },
                             {
                                 "mDataProp": "CampusName",
                                 "bSearchable": false,
                                 "bSortable": false

                             },
                              {
                                  "mDataProp": "Name",
                                  "bSearchable": true,
                                  "bSortable": false
                              },
                            {
                                "mDataProp": "Description",
                                "bSearchable": false,
                                "bSortable": false
                            },
                            {
                                "mData": null,
                                "bSearchable": false,
                                "bSortable": false,
                                "fnRender": function (oObj) {
                                    return '<a class="edit" title="Edit" href=""></a>';
                                }
                            }
                ]
            });
            searchDataInDataTable(oTable);
            $("#DiscountDataTable tbody").delegate("tr a", "click", function (e) {
                e.preventDefault();
                var self = $(this);
                var pos = self.closest('tr').index();
                var aData;
                if (pos != null) {
                    if (self.hasClass('fa fa-edit')) {
                        aData = oTable.fnGetData(pos); //get data of the clicked row                                 
                        $('#txtdiscountID').val(aData["DiscountId"]);
                        $('#txtDisName').val(aData["Name"]);
                        $('#txtDisRemarks').val(aData["Description"]);
                        $('#disCampus').children().each(function () {
                            this.selected = ($.trim(this.text) == $.trim(aData["CampusName"]));
                        });

                    }
                }

            });

        },

Answer 1

您将错误的配置传递给数据表。例如，选项'sAjaxSource'需要被称为'ajax'。您可以在https://datatables.net/reference/option/找到每个选项的正确名称。

正确的配置是：

var oTable = $('#DiscountDataTable').dataTable({
            'jQueryUI': true,
            'paginationType': 'full_numbers',
            'serverSide': true,
            .........
            'ajax': '/forms/Setup/Setup.aspx/GetDiscountBycampus?CampusId=' + id,
            .........

}）;

jquery dataTable Exception（oSettings为null; var nOrig = oSettings.nTableWrapper.parentNode;）

1 个答案: