I am writing a code for server side processing for DataTables. I have a UI page where I collect all user input like start / end dates, token ID, batch Id etc. Now I have to pass these values to backend script and run a query and render output to datatables in UI page.

So I have the JS code to take and validate user input but I am not sure how to call / set params for datatables to state server side scripting. Below is my script:

function runreport(datastring)
{
       var oTable = $('#example').dataTable( {
                "bProcessing": true,
                "bServerSide": true,
                "sAjaxSource": "runsearch.py",
                "bDestroy" : true,
                "fnServerData": function ( sSource, aoData, fnCallback ) {
                        $.ajax( {
                                        "dataType": 'json',
                                        "type": "POST",
                                        "url": sSource,
                                        "data": aoData,
                                        "success": function(json) {
                                                $("div#report_result").show();
                                                $('html, body').animate({scrollTop:$(document).height()}, 'slow');
                                                fnCallback(json);
                                        }
                                } );
                 }
        } );
}

I call 'runreport' method when all input params are validated. I construct datastring as like query string : token_id=xxxx&[email protected]&start_date=1212121212&end_date=98989898 but these values are not getting passed? I get the below error:

k is undefined
[Break On This Error]  

...Sorting=="undefined"&&typeof e.saved_aaSorting=="undefined")e.aaSorting[a][1]=k....

jquery....min.js (line 150)

What we should do to have DataTables result generated from a backend script?

I am not getting the result output as desired? Is this the right way to call DataTables functionality for server side processg?

Below is my Python code that dumps static result set:

#!/usr/local/bin/python

import cgi
import MySQLdb
import json

print "Content-Type: application/json"
print

displaylength =5
result = {'iDisplayLength':str(displaylength), 'sPaginationType':'full_numbers', 'bProcessing':1, 'bDestroy': 1, 'bRetrieve':1, 'aaData':[{'First Field':'First Field Value', 'Second Field':'Second Field Value', 'Third Field':'Third Field Value', 'Fourth Field':'Fourth Field Value', 'Fifth Field':'Fifth Field Value', 'Sixth Field':'Sixth Field Value', 'Seventh Field':'Seventh Field Value', 'Eight Field':'Eight Field Value', 'Nineth Field':'Nineth Field Value'}, {'First Field':'First Field Value', 'Second Field':'Second Field Value', 'Third Field':'Third Field Value', 'Fourth Field':'Fourth Field Value', 'Fifth Field':'Fifth Field Value', 'Sixth Field':'Sixth Field Value', 'Seventh Field':'Seventh Field Value', 'Eight Field':'Eight Field Value', 'Nineth Field':'Nineth Field Value'}], 'aoColumns':[{'sTitle':'First Field', 'mDataProp': 'First Field'},{ 'sTitle':'Second Field', 'mDataProp': 'Second Field'}, {'sTitle':'Third Field', 'mDataProp': 'Third Field' }, { 'sTitle':'Fourth Field', 'mDataProp': 'Fourth Field' }, { 'sTitle':'Fifth Field' , 'mDataProp': 'Fifth Field' }, { 'sTitle':'Sixth Field', 'mDataProp': 'Sixth Field' }, { 'sTitle':'Seventh Field', 'mDataProp': 'Seventh Field' }, { 'sTitle':'Eight Field', 'mDataProp': 'Eight Field' }, { 'sTitle':'Nineth Field', 'mDataProp': 'Nineth Field' }]}

json_string = json.dumps(result)
print json_string
link|improve this question

46% accept rate
feedback

2 Answers

There are multiple ways to do this. DataTables supports AJAX source and therefore you can write a script that will output a json array and pass it to the DataTables plugin.You could also just render the table from PHP.

I would look through some of there examples to see other ways you could pass data to DataTables.

link|improve this answer
datatables.net/usage/#data_sources Yes and I want to use Server Side Processing and would like to know what is wrong with my script? – Prakash May 15 at 12:33
What language are you writing your server side script in? Please share that code as well. I wont know where the problem is if I can't see the code. – Farhan Ahmad May 15 at 12:36
I have added the backend code written in Python – Prakash May 16 at 1:00
feedback

aoData.push is what you're looking for. Use this for your fnServerData callback, replacing the name and value in aoData.push for the values you want to pass. Name will be the key and value will be the value, passed as $_REQUEST variables:

"fnServerData": function ( sSource, aoData, fnCallback ) {
        aoData.push({ "name": "var1name", "value": $('#var1').val() },
                    { "var2name": "company_name", "value": $('#var2').val() });

        $.ajax({
            "dataType": 'json',
            "type": "POST",
            "url": sSource,
            "data": aoData,
            "success": fnCallback
         });
}

To test that it's working, make the page that is getting the ajax request simply mail you the $_REQUEST. You should see these variables as part of it.

A common companion to the callback is adding a button to refresh the table. That's simply done by binding the following to a click handler on a refresh button:

oTable.fnDraw(false);

Good luck.

link|improve this answer
feedback

Your Answer

 
or
required, but never shown

Not the answer you're looking for? Browse other questions tagged or ask your own question.