Using ajax.json() to access the ajax data after the table loads

jaredgerber

I'm looking to pass additional data to my page using the DataTables ajax request.

What I need to do is get a sum of a column from the server since my recordset is very large -- it takes too long or hangs in datatables. Also, the total for all records doesn't work at all using ServerSide processing - it seems to give only the totals for the page.

Other than the <div id="total"> value being updated on my page, the report is working great.

Am I doing something wrong here? Is this a good idea?

Here is my link:
http://174.120.222.66/~opes/admin/rpt_sitepayments.php

Here is my DataTables Javascript:

var table = "";
$(document).ready(function()
{
    $("#pleasewait").show();
    table = $('#paymentsGrid_').dataTable( {
        "bProcessing": true,
        "bServerSide": true,
        "pageLength": 25,
        "sAjaxSource": "php/processList.php?list=sitepayments&has_form=false",
}                   
  } );

// use ajax.json() to access the data source
var json = table.ajax.json();
var obj = jQuery.parseJSON( json );
$("#total").html(obj.fSum);

Here is my Ajax:

{"sEcho":0,"iTotalRecords":"3370","iTotalDisplayRecords":"3440","sSumCol":"Price","fSum":"179390","aaData":
[["","10\/22\/2014 00:10","John Frank (OFS3078) IA","Application","Membership Application","1","125",null],
["","10\/22\/2014 00:10","John Frank (OFS3078) IA","Subscription","Monthly Fee","1","25","12\/31\/2014"],
["","10\/22\/2014 00:10","John Frank (OFS3078) IA","Event","Event Fee","1","100",null]...

jaredgerber

Ok -- I figured this out. As you can see, I passed fSum in the json above. Apparently, hopefully, lol, Datatables doesn't mind other values being in that array.

I was able to update my footer using this code.

var table = "";
$(document).ready(function()
{
    $("#pleasewait").show();
    table = $('#paymentsGrid_').dataTable( {
        "bProcessing": true,
        "bServerSide": true,
        "sAjaxSource": "php/processList.php?list=sitepayments&has_form=false",

        // MAGIC TO ACCESS VALUES IN JSON
        "fnInitComplete": function(oSettings, json) {
         $("#total").html('$'+json.fSum);
    }                   
});

Here is my tfoot in case it helps you:

<tfoot>
    <tr>
        <th colspan="7">
        Total: <div  style="float:right;" id="total">0</div></th>
    </tr>
</tfoot>

allan

Apparently, hopefully, lol, Datatables doesn't mind other values being in that array.

It doesn't - intentionally :-)

Allan

jaredgerber

Sweet :-) This works perfect for good client-server communication.