Get large quantity of data in module using jquery.datatables Server-side processing

Miguel Sá Pinto

Im trying to get jquery.datatables working using server side processing and pagination in a dotnetnuke module. Im using the documentation from the the followin article as a guide but i cant get it working.

I want to call the method from a control class but im getting an error:

_var viewmodel = new VesselModule.vesselListViewModel(moduleId, localizedSettings);
viewmodel.init();

    ko.applyBindings(viewmodel, $("#Vessels-" + moduleId)[0]);

    vm = viewmodel;

    // datatables

    function initDataTable() {
        //$.fn.dataTable.moment( 'MM D YY' );
        $("#VesselsTable-" + moduleId).DataTable({
            "paging": true,  
             "ordering": true,  
             "filter": true,  
             "destroy": true,  
             "orderMulti": false,  
             "serverSide": true,  
             "Processing": true,  
             "columnDefs": [  
                 { "width": "5%", "targets": [0] }  
             ],  
            "ajax":  
                {  
                    "url": vm.service.framework.getServiceRoot(vm.service.path) + "VesselInfo/GetListByPage/",  
                    "type": "POST",  
                    "dataType": "JSON"  
                },  
            "aoColumns": [
                {"mDataProp": "IMO"},  
                {"mDataProp": "VesselName"},  
                { "mDataProp": "ISNCompany" },
                {"mDataProp": "OwnerName"},  
                { "mDataProp": "VesselState" },
                {"mDataProp": "VesselName"},  
                { "mDataProp": "VesselType" },
                { "mDataProp": "InProgressDate" },
                { "mDataProp": "STDate" },
                {"mDataProp": "Actions"}
            ]  
        });

    }

_

The error im getting is:

(index):616 Uncaught SyntaxError: Unexpected token '}'

if i remove the code:

_ "aoColumns": [
{"mDataProp": "IMO"},
{"mDataProp": "VesselName"},
{ "mDataProp": "ISNCompany" },
{"mDataProp": "OwnerName"},
{ "mDataProp": "VesselState" },
{"mDataProp": "VesselName"},
{ "mDataProp": "VesselType" },
{ "mDataProp": "InProgressDate" },
{ "mDataProp": "STDate" },
{"mDataProp": "Actions"}
] _

The next error is returned:

_ jquery.js?cdv=800:8526 POST http://[dnn link page]/VesselInfo/GetListByPage/ 405 (Method Not Allowed)
send @ jquery.js?cdv=800:8526
ajax @ jquery.js?cdv=800:7978
ua @ jquery.dataTables.min.js:36
nb @ jquery.dataTables.min.js:37
O @ jquery.dataTables.min.js:29
T @ jquery.dataTables.min.js:31
ha @ jquery.dataTables.min.js:48
e @ jquery.dataTables.min.js:93
(anonymous) @ jquery.dataTables.min.js:93
each @ jquery.js?cdv=800:648
each @ jquery.js?cdv=800:270
m @ jquery.dataTables.min.js:82
h.fn.DataTable @ jquery.dataTables.min.js:167
initDataTable @ (index):598
(anonymous) @ (index):627
fire @ jquery.js?cdv=800:1037
fireWith @ jquery.js?cdv=800:1148
ready @ jquery.js?cdv=800:433
completed @ jquery.js?cdv=800:103_

if i add HttpPost in the method that is being called

  _  [HttpPost]
    public HttpResponseMessage GetListByPage()
    {
        try
        {

            return Request.CreateResponse("");
        }
        catch (System.Exception e)
        {
            // error
            log.Error(e.ToString());

            return Request.CreateResponse(System.Net.HttpStatusCode.InternalServerError, e.Message);
        }
    }_

then the returned error is:

_ jquery.js?cdv=802:8526 POST http://[dnn link page]/VesselInfo/GetListByPage/ 401 (Unauthorized)_

Can you help? Thank you!