Problem displaying rows in IE 7
Problem displaying rows in IE 7
I am using dataTables 1.5 and everithing works just fine in firefox but not in Internet Explorer 7.0.5730
Besides I´ve reviewed my response json object with http://www.jsonlint.com/ and all is fine.
The more strange thing is that no error is shown, only the rows are not displayed.
Somebody could help me to solve this misterious case?
My code to retrieve data is:
var dTable; //Data table
var JSonObj;
dojo.require("dojo.dnd.Source");
$(document).ready(function() {
dTable = $('#example').dataTable( {
"sPaginationType": "full_numbers",
"bLengthChange": true,
"iDisplayLength": 500,
"bProcessing": true,
"aoColumns": [
/*idlot*/ { "bSearchable": false,
"bVisible": false},
/*description*/ null,
/*creation date*/ { "sClass": "center"},
/*activation date*/ { "sClass": "center"},
/*pins number*/ { "sClass": "center",
"sType": "html"},
/*reference*/ { "sClass": "center"},
/*card image*/ { "sClass": "center"},
],
"sAjaxSource": 'getLotsActivationPagination.do',
"oLanguage": {
"sProcessing": "Procesando ...",
"sLengthMenu": "Mostrar 1005001000 registros por página",
"sZeroRecords": "No se encontraron resultados",
"sInfo": "Mostrando de _START_ a _END_ de _TOTAL_ registros",
"sInfoEmtpy": "Mostrando de 0 a 0 de 0 registros",
"sInfoFiltered": "(filtrado _MAX_ del total de registros)",
"sSearch": "Buscar:",
"oPaginate": {
"sFirst": "Primero",
"sPrevious": "Anterior",
"sNext": "Siguiente",
"sLast": "Último"
}
}
});
//$("#example tr *:nth-child(1)").css("display","none");
//dTable.fnSetColumnVis(0, false);
$("#example tr").live("click", function(){
//$( dTable.fnGetNodes() ).click( function () {
if ( $(this).hasClass('row_selected') )
$(this).removeClass('row_selected');
else
$(this).addClass('row_selected');
});
});
and the way I am generating the response is:
StringBuffer sbOutput = new StringBuffer();
sbOutput.append("{");
sbOutput.append("\"iTotalRecords\": " + iTotal + ", ");
sbOutput.append("\"iTotalDisplayRecords\": " + iFilteredTotal + ", ");
PrintWriter writer = response.getWriter(); //Writes to the response to allow Ajax behavior
StringBuffer sbLots = new StringBuffer("\"aaData\": [ ");
while (itLots.hasNext()) {
lot = (Lot) itLots.next();
if (!sbLots.toString().equals("\"aaData\": [ ")) sbLots.append(",");
sbLots.append("[");
sbLots.append("\"" + lot.getId() + "\","); //Id
sbLots.append("\"" + lot.getDescription() + "\","); //Description
sbLots.append("\"" + lot.getCreationDate() + "\","); //Creation date
sbLots.append("\"" + nullToBlank(lot.getActivationDate()) + "\","); //Activation date
sbLots.append("\"" + lot.getPins() + "\","); //Pins number
sbLots.append("\"" + lot.getReference() + "\","); //Reference
sbLots.append("\"\""); //Card Image
sbLots.append("]");
}
sbOutput.append(sbLots.toString());
sbOutput.append("]"); //close aaData array
sbOutput.append("}"); //close json object
writer.print(sbOutput.toString());
Thanks in advance.
Besides I´ve reviewed my response json object with http://www.jsonlint.com/ and all is fine.
The more strange thing is that no error is shown, only the rows are not displayed.
Somebody could help me to solve this misterious case?
My code to retrieve data is:
var dTable; //Data table
var JSonObj;
dojo.require("dojo.dnd.Source");
$(document).ready(function() {
dTable = $('#example').dataTable( {
"sPaginationType": "full_numbers",
"bLengthChange": true,
"iDisplayLength": 500,
"bProcessing": true,
"aoColumns": [
/*idlot*/ { "bSearchable": false,
"bVisible": false},
/*description*/ null,
/*creation date*/ { "sClass": "center"},
/*activation date*/ { "sClass": "center"},
/*pins number*/ { "sClass": "center",
"sType": "html"},
/*reference*/ { "sClass": "center"},
/*card image*/ { "sClass": "center"},
],
"sAjaxSource": 'getLotsActivationPagination.do',
"oLanguage": {
"sProcessing": "Procesando ...",
"sLengthMenu": "Mostrar 1005001000 registros por página",
"sZeroRecords": "No se encontraron resultados",
"sInfo": "Mostrando de _START_ a _END_ de _TOTAL_ registros",
"sInfoEmtpy": "Mostrando de 0 a 0 de 0 registros",
"sInfoFiltered": "(filtrado _MAX_ del total de registros)",
"sSearch": "Buscar:",
"oPaginate": {
"sFirst": "Primero",
"sPrevious": "Anterior",
"sNext": "Siguiente",
"sLast": "Último"
}
}
});
//$("#example tr *:nth-child(1)").css("display","none");
//dTable.fnSetColumnVis(0, false);
$("#example tr").live("click", function(){
//$( dTable.fnGetNodes() ).click( function () {
if ( $(this).hasClass('row_selected') )
$(this).removeClass('row_selected');
else
$(this).addClass('row_selected');
});
});
and the way I am generating the response is:
StringBuffer sbOutput = new StringBuffer();
sbOutput.append("{");
sbOutput.append("\"iTotalRecords\": " + iTotal + ", ");
sbOutput.append("\"iTotalDisplayRecords\": " + iFilteredTotal + ", ");
PrintWriter writer = response.getWriter(); //Writes to the response to allow Ajax behavior
StringBuffer sbLots = new StringBuffer("\"aaData\": [ ");
while (itLots.hasNext()) {
lot = (Lot) itLots.next();
if (!sbLots.toString().equals("\"aaData\": [ ")) sbLots.append(",");
sbLots.append("[");
sbLots.append("\"" + lot.getId() + "\","); //Id
sbLots.append("\"" + lot.getDescription() + "\","); //Description
sbLots.append("\"" + lot.getCreationDate() + "\","); //Creation date
sbLots.append("\"" + nullToBlank(lot.getActivationDate()) + "\","); //Activation date
sbLots.append("\"" + lot.getPins() + "\","); //Pins number
sbLots.append("\"" + lot.getReference() + "\","); //Reference
sbLots.append("\"\""); //Card Image
sbLots.append("]");
}
sbOutput.append(sbLots.toString());
sbOutput.append("]"); //close aaData array
sbOutput.append("}"); //close json object
writer.print(sbOutput.toString());
Thanks in advance.
This discussion has been closed.
Replies
Very odd that this should work in Firefox but not IE. Fo you have a link to a demo page which shows this problem? Would make debugging much easier :-)
Thanks,
Allan
My problem was
"aoColumns": [
/*idlot*/ { "bSearchable": false,
"bVisible": false},
/*description*/ null,
/*creation date*/ { "sClass": "center"},
/*activation date*/ { "sClass": "center"},
/*pins number*/ { "sClass": "center",
"sType": "html"},
/*reference*/ { "sClass": "center"},
/*card image*/ { "sClass": "center"}, // <-- The trailing comma. The JSON object was malformed.
],
Did that pass in JSON lint? I think they might have an error there if so...
Allan