Serverside scripting - navigation & search issue in IE 7

aysa

Hi allan,

Navigation (pagination) and Search (filter) are not working on IE 7 for server side scripting. It is working perfectly in other browsers.
I am using Coldfusion & MS SQL. Can any body please help me?

thank you
ritha

aysa

Allan,
Please respond me to this issue.

Thanks in advance,
ritha

somethingJava

Hi Allan,

I am having a similar issue to this one.

Environment: Firefox, Coldfusion 7, MySQL

Oddly enough, I am seeing the navigation, but they look disabled.
Example of what I am seeing can be seen at

http://sandbox.somethingJavaprojects.net/admin/

username: admin
password: test

Click on "content" under "CMS & System Management"

JS Implementation:
[code]

oTable = $('#list').dataTable( {
"sAjaxSource": '#actionPage#?action=get',
"bJQueryUI": true,
"bServerSide": true,
"sPaginationType": "full_numbers",
"bPaginate":true,
"bProcessing":true,
"RowTools":true,
"fnInitComplete": function(){
//oTable.fnRowTools();
},
"fnDrawCallback": function(){
// I added this, so that it makes this call
// on any redraw of the table.
if(oTable){oTable.fnRowTools()};
}
} );

[/code]

Firebug Debug info ( URL scope Params )
[code]
action=get
bEscapeRegex=true
bEscapeRegex_0=true
bEscapeRegex_1=true
bEscapeRegex_2=true
bEscapeRegex_3=true
iColumns=4
iDisplayLength=10
iDisplayStart=0
iSortCol_0=0
iSortDir_0=asc
iSortingCols=1
sColumns=
sEcho=1
sSearch=
sSearch_0=
sSearch_1=
sSearch_2=
sSearch_3=
[/code]

Firebug Debug Info ( response ):
[code]
{"sEcho":1,"iTotalRecords":13,"iTotalDisplayRecords":10,"aaData":[["1","1","homepagecontent","2009-08-19 15:48:41.0"],["2","1","Test 2","2010-04-26 20:52:46.0"],["3","1","test","2010-05-13 18:13:59.0"],["4","1","test","2010-05-13 18:14:09.0"],["5","1","test","2010-05-13 18:14:17.0"],["6","1","test","2010-05-13 18:14:29.0"],["7","1","test","2010-05-13 18:14:48.0"],["8","1","test","2010-05-13 18:14:59.0"],["9","1","rwar","2010-05-13 18:15:48.0"],["10","1","Test 2","2010-05-13 18:17:14.0"]]}
[/code]

From what I can see tell, Everything else works. Sorting, Searching, drop down for number of records to show,
all these features work. The only thing that does not seem to function properly is the pagenation.

Also note, what you are seeing is bluApple 2.5 CMS by somethingJava, LLC which is my company.
a product that is open source (Apache GPL) and I am using datatables in the admin section of the
CMS. BA 2.5 has not yet been released to the public. Current version 2.0 does not use datatables.

Any help you can provide me will be greatly appreciated.

Thanks,
Marco G. Williams (CEO)
somethingJava, LLC

codingavenue

Hi,

Im not an expert on DataTables but maybe I can help. Could you post the code that gives you your iTotalDisplayRecords value? I believe that is the variable that DataTables is using for pagination.

codingavenue.

somethingJava

[code]
records.recordcount
[/code]

I am posting the rest of the code, but this is the outputted variable. The rest of this code may not make sense because it is out of context, but here it is.

[code]




#application.objRequest.toJSON.queryToJSONDTSS(url.sEcho,rc.recordcount,records.recordcount,records,'aaData','id,active,name,lastmodified')#


[/code]

allan

@somethingJava: The problem is that you are returning iTotalDisplayRecords as 10. DataTables is displaying ten records, so it doesn't think that there is anything else to display - hence pagination is effectively disabled. What DataTables expects from iTotalDisplayRecords is the total number of records to be displayed over all pages, after filtering. iTotalRecords is the total number of records to display prior to filtering. You don't need to give the number of records you are returning, because DataTables can easily count them.

Nice use of DataTables btw! Looking forward to seeing your 2.5 release.

Allan

somethingJava

Awesome! This fixed my issue!
And thanks for the compliments!

aysa

Hi,

Still I couldn’t resolve my issue in IE with data tables Server-side processing ColdFusion. When I click on navigation or paging & searching, it is giving me an error message. Sorting & dropdown are working fine.

Error: 'length' is null or not an object
and it is pointing to

[code]
if ( aData.length != oSettings.aoColumns.length )
{
alert( "DataTables warning: Added data does not match known number of columns" );
return -1;
}
[/code]

There is no issue in FF. Iam using Coldfusion 7 & Mssql
here is my actual code
[code]
$('.filterTableInd').dataTable( {
"bProcessing": true,
"bServerSide": true,
"bInfo": true,
"sAjaxSource": "../dsp/dsp_test.cfm",
"aoColumns": [
{ "sType": "string", "sTitle": "Industry", "sWidth":"20%"},
{ "sType": "string", "sTitle": "Material", "sWidth":"20%" },
{ "sType": "string", "sTitle": "Title", "sWidth":"50%" }
],
"oSearch": { "sSearch": "", "bEscapeRegex": true },
"sPaginationType": "full_numbers",
"bPaginate": true,
"fnServerData": function ( sSource, aoData, fnCallback ) {
$.ajax( {
"dataType": 'json',
"type": "POST",
"url": sSource,
"data": aoData,
"success": fnCallback
} );
}
} );
[/code]

Json response
[code]
{"sEcho": 1, "iTotalRecords": 239, "iTotalDisplayRecords": 239, "aaData": [ ["A Test Industry 1", "Web Pages", "Chris's New Item Link" ], ["A Test Industry 1", "Fliers", "Chris's New Uploaded Item" ], ["A Test Industry 1", "Marketing Plans", "marketing plan" ], ["A Test Industry 1-A", "Advertising", "new test" ], ["a test industry 2", "Brochures", "What is GIS" ]]}
[/code]

thanks in advance
ritha

somethingJava

I don't see anything directly from the code you posted. Might be able to help you better if you gave me a link to an actual page where I can inspect what is going on.

However, some things that I am noticing that are probably not necessary to do.

1. Why are you overriding "fnServerData" the post method is already built into datatables, so you can pretty much cut that out of your script all together.
2. not sure what oSearch is for, but I don't use it at all.

Login to the example site in my post, feel free to poke around in blogs, or any of the other modules they all use Server-Side datatables and they are functional.

you can also contact me directly at somethingJava@gmail.com

aysa

Thanks for quick response.

I tried removing the fnServerData & oSearch, but no luck - still throwing an error in IE.
If anything wrong with my data records, the drop down should not even work.
I don't understand what is the issue with.

Thank you
ritha

somethingJava

In an email you sent me the following, I assume from firebug, of the params that were being passed.

[code]
bEscapeRegex =true
bEscapeRegex_0=true
bEscapeRegex_1=true
bEscapeRegex_2=true
bSearchable_0=true
bSearchable_1=true
bSearchable_2=true
bSortable_0=true
bSortable_1=true
bSortable_2=true
iColumns=3
iDisplayLength=10
iDisplayStart=0
iSortCol_0=0
iSortingCols =1
sColumns =
sEcho=1
sSearch=
sSearch_0=
sSearch_1=
sSearch_2=
sSortDir_0 =asc
[/code]

There is one thing that caught my eye, Allan correct me if I am wrong, your saying there are 3 columns but in the "sColumns" variable there is no value. I don't know what the solution is, but I wonder if this is what is causing the issue.

Allen do you have any insight?

As far as I've seen, your JSON is perfect, your implementation seems correct.

Personally, I don't use a custom renderer for each column, I use CSS to decided what my column width's are.
If i do use a renderer in the 'aoColumns' attribute, it is only to do something like format the column for a date.

Other than that, I do not feel that your issue is in any way related to Coldfusion.

aysa

I hope it is not related to Coldfusion.
Some where the array aData.length is becoming undefined, error is at the function _fnAddData
[code]
function _fnAddData ( oSettings, aData )
{
/* Sanity check the length of the new array */
if ( aData.length != oSettings.aoColumns.length )
{
alert( "DataTables warning: Added data does not match known number of columns" );
return -1;
}
.....
[/code]

somethingJava

Aysa,

_fnAddData() is a feature of ver 1.6.2 / have you tried your code on ver 1.5.3?

It's a slightly older version, there might be a bug in that function. I know it works fine in the previous version,
you might want to check into that for a quick fix. At least until Allan has some time to research any bug with this function.

aysa

Changed the ver to 1.5.3 & 1.6.1... but no luck :( . it is showing same old error at _fnAddData()

aysa

Hurray :) ...... issue got solved.....sorry, it was my mistake. there is an extra comma(,) existed for page 2 json response.
Wrong Json
[code]
{"sEcho": 2, "iTotalRecords": 239, "iTotalDisplayRecords": 239, "aaData": [ ["A Test Industry 1", "Web Pages", "Chris's New Item Link" ], ["A Test Industry 1", "Fliers", "Chris's New Uploaded Item" ], ["A Test Industry 1", "Marketing Plans", "marketing plan" ], ["A Test Industry 1-A", "Advertising", "new test" ], ["a test industry 2", "Brochures", "What is GIS" ],]}
[/code]

at last IE issue got solved.

@somethingJave: I really thank full to you, for your quickly response and suggestions

thank you
ritha

allan

@ somethingJava - nice one. Thanks for following up on this

@ ritha - good to hear you got it sorted. http://jsonlint.com is excellent for testing JSON when it looks like everything should be working.

DataTables 1.7 is going to show an alert() when it detects JSON which is malformed - this will hopefully easy this kind of error.

Regards,
Allan