Issues with jQuery DataTables and $.getJSON in ASP.NET Web API

Question

I am trying to build Jquery DataTables from a JSON result that is returned from an ASP.NET Web Api controller.

I am getting results on the initial page load, but when I click to sort columns, pagination, etc... there are no results. It is as if my DataTable is not able to load the JSON.

Here is my code, thanks in advance for any help offered:

var apiUrl = 'api/dockets?beginning_date=10/28/2013';

$(document).ready(function () {
    $('#results-list').dataTable({

        "bProcessing": true,
        "bServerSide": true,
        "sAjaxSource": "/api/dockets"

    });
    // Send an AJAX request
    $.getJSON(apiUrl)
        .done(function (data) {

            $.each(data, function (key, item) {

                $('<tr><td>' + item.LastName + ', ' + item.FirstName + '</td><td>' + item.CaseNumber + '</td><td>' + item.CaseStatus + '</td><td>' + item.CourtSessionDate + '</td><td>' + item.CourtSessionStartTime + '</td><td>' + item.AppearanceReason + '</td><td>' + item.CourtRoom + '</td><td>' + item.OffenseDescription + '</tr>').appendTo("#results-list tbody");
            });
        });
});

Christopher Crisis · Accepted Answer · 2013-10-29 18:21:32Z

Ok, got this working. Was easier than I was making it out to be.

Apparently if you are using "sAjaxSource="mySource/", then you do not need the extra jquery JSON call.

Also, added var oTable wrapper to my dataTable call, and defined my columns with mData:

$(document).ready(function () {
   var oTable = $('#results-list').dataTable({
        "bFilter": false,
        "bProcessing": true,
        "sAjaxDataProp": "",
        "aoColumns": [
        { "mData": "LastName" },
        { "mData": "CaseNumber" },
        { "mData": "CaseStatus" },
        { "mData": "CourtSessionDate" },
        { "mData": "CourtSessionStartTime" },
        { "mData": "AppearanceReason" },
        { "mData": "CourtRoom" },
        { "mData": "OffenseDescription" }
        ],
        "sAjaxSource": "api/dockets?beginning_date=10/30/2013",
        "bInfo": false
    });
});

Collectives™ on Stack Overflow

Issues with jQuery DataTables and $.getJSON in ASP.NET Web API

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related