ajax data source "json formatting error"

dwissmann

Hello,
I have used your datatables quite a bit and I must say it is a great augmentation to the way we can interact with data. However, I have been going insane getting my table to work using ajax and json. I am initiating the table with the following:
[code] currentTableObject = $('#parentList').dataTable({
"bProcessing": true,
"sAjaxSource": "/DSLMobile/admin/parent/parent.ajax.php?action=list",
"aoColumns": [{"mDataProp":"ID"},
{"mDataProp":"NAME"},
{"mDataProp":"PHONE"},
{"mDataProp":"ISCOACH"},
{"mDataProp":"ISDIVCOORD"},
{"mDataProp":"ROLES.SPONSOR_EDIT"},
{"mDataProp":"ROLES.SPONSOR_CREATE"},
{"mDataProp":"ROLES.WEBEDITOR"},
{"mDataProp":"ROLES.TREASURER"},
{"mDataProp":"ROLES.EVENTMANAGEMENT"},
{"mDataProp":"ROLES.DSLPresident"},
{"mDataProp":"ROLES.DSLVICEPRESIDENT"},
{"mDataProp":"VOLUNTEER.volunteer_coach"},
{"mDataProp":"VOLUNTEER.volunteer_coach_assistant"},
{"mDataProp":"VOLUNTEER.volunteer_divcoordinator"},
{"mDataProp":"VOLUNTEER.volunteer_sponsor"},
{"mDataProp":"VOLUNTEER.volunteer_web"},
{"mDataProp":"VOLUNTEER.volunteer_unifor"},
{"mDataProp":"VOLUNTEER.volunteer_photo"},
{"mDataProp":"VOLUNTEER.volunteer_trophy"},
{"mDataProp":"VOLUNTEER.girl_jamboree"},
{"mDataProp":"VOLUNTEER.pier40_advocate"}
],
"sDom": '<"tableToolBar"f>rti',
// "bProcessing": true,
"bSortCellsTop": true,
"bAutoWidth": false,
"bPaginate": false,
"bSort" : false,
"sScrollY": $(window).height() - $("#parentList").offset().top-200,
"fnRowCallback": function( nRow, aData, iDisplayIndex ) {
// Append the grade to the default row class name
for (c=3;c

dwissmann

just for a brief time with fake data, I made the page available on line at https://www.downtownsoccer.org/DSLMobile/CMA/parentManagement.php

allan

It looks like the file the DataTable is requesting for data is just returning empty: https://www.downtownsoccer.org/DSLMobile/admin/parent/parent.ajax.php?action=list .

Allan

dwissmann

Oh for crying out loud - after two days, I had to find out that I spelled the word list lower case and it expects it UPPER CASE.

Well, my cursing continues but I sure appreciate you making me like a fool - Thanks for your help even thought I will hate myself for a while that I didn't catch that

it works well now - thanks - you can close that post - or even better delete it

dwissmann

I have a follow up question (for now I put the page back behind auth). So, now the table shows up beautifully - I use "mData..."mRender" with a function to display an image of a checkbox when the data equals true. like this:
[code]mDataDefinitions.push({ "mData": "ISCOACH","mRender":function ( data, type, full ) {return drawCheckMark(data,'is allowed to work as a coach');} });
[/code]
the function drawCheckMark just returns an HTML-string of that image if data = true. Now... I would like to filter on that column to only show rows with a checkmark. I use a click function on the column header that call following function:
[code]function booleanFilter(colObj) {
$(colObj).toggleClass( "colClickFilter-on colClickFilter-off" );
currentColumnNumber = $(colObj).index() +3;
//alert('filtering column ' + currentColumnNumber);
tableObject = $('#parentList').dataTable();
if ($(colObj).hasClass('colClickFilter-on')) {
tableObject.fnFilter('true',currentColumnNumber);
} else {
tableObject.fnFilter('',currentColumnNumber);
}
}
[/code]
all is fine, but the result is that all rows are now gone - I assume it is because of the cell containing HTML instead of the value. So I looked into the mData function example at https://www.datatables.net/usage/columns - but it isn't clear to me if how I have to use it. Do I still initially retrieve the data with above example using aoColumns and then add the aoColumnDefs for the columns I want to alter or do I have to switch everything to aoColumnDefs?