IE 6 Issues...
IE 6 Issues...
Yeah I know IE 6.... anyways I can't control that variable of the project...
Anyways heres the deal
This is the error I get when loading my page in IE6 (I don't think it works in any IE but I may be mistaken since I cant test anything other than IE6 and FF3 here)
http://img132.imageshack.us/img132/6170/errorcqx.png
It works fine in Firefox btw...
Heres my code
[code]
var oTable;
var giRedraw = false;
$(document).ready(function() {
$("#example tbody").click(function(event) {
if ( $(event.target.parentNode).hasClass('row_selected') )
$(event.target.parentNode).removeClass('row_selected');
else
$(event.target.parentNode).addClass('row_selected');
});
$("#example tbody").dblclick(function(event) {
alert('Edit Mode');
});
oTable = $('#example').dataTable( {
"aoColumns": [
/* ID */ { "bVisible": false },
/* SID */ null,
/* Full Name */ null,
/* Status */ null,
/* Owner */ null,
/* Assigned To */ null
],
"sPaginationType": "full_numbers",
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "<?php echo base_url(); ?>problems/query",
"fnServerData": function ( sSource, aoData, fnCallback ) {
/* Add some extra data to the sender */
var work_category = document.getElementById('work_category');
var sets = document.getElementById('sets');
var employer = document.getElementById('employer');
var error_type = document.getElementById('error_type');
var status = document.getElementById('work_category');
var phase = document.getElementById('phase');
var extract = document.getElementById('extract');
aoData.push( { "name": "source", "value": "<?php echo $this->router->method; ?>"},
{ "name": "work_category", "value": work_category.value },
{ "name": "sets", "value": sets.value },
{ "name": "employer", "value": employer.value },
{ "name": "error_type", "value": error_type.value },
{ "name": "status", "value": status.value },
{ "name": "phase", "value": phase.value },
{ "name": "extract", "value": extract.value }
);
$.getJSON( sSource, aoData, function (json) {
/* Do whatever additional processing you want on the callback, then tell DataTables */
fnCallback(json)
} );
}
}).fnSetFilteringDelay(1000);
});
[/code]
SO Yeah I need to get this working in IE6 (which your demos do work in IE6!) Otherwise I will be having to go my separate way for this project.
Anyways heres the deal
This is the error I get when loading my page in IE6 (I don't think it works in any IE but I may be mistaken since I cant test anything other than IE6 and FF3 here)
http://img132.imageshack.us/img132/6170/errorcqx.png
It works fine in Firefox btw...
Heres my code
[code]
var oTable;
var giRedraw = false;
$(document).ready(function() {
$("#example tbody").click(function(event) {
if ( $(event.target.parentNode).hasClass('row_selected') )
$(event.target.parentNode).removeClass('row_selected');
else
$(event.target.parentNode).addClass('row_selected');
});
$("#example tbody").dblclick(function(event) {
alert('Edit Mode');
});
oTable = $('#example').dataTable( {
"aoColumns": [
/* ID */ { "bVisible": false },
/* SID */ null,
/* Full Name */ null,
/* Status */ null,
/* Owner */ null,
/* Assigned To */ null
],
"sPaginationType": "full_numbers",
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "<?php echo base_url(); ?>problems/query",
"fnServerData": function ( sSource, aoData, fnCallback ) {
/* Add some extra data to the sender */
var work_category = document.getElementById('work_category');
var sets = document.getElementById('sets');
var employer = document.getElementById('employer');
var error_type = document.getElementById('error_type');
var status = document.getElementById('work_category');
var phase = document.getElementById('phase');
var extract = document.getElementById('extract');
aoData.push( { "name": "source", "value": "<?php echo $this->router->method; ?>"},
{ "name": "work_category", "value": work_category.value },
{ "name": "sets", "value": sets.value },
{ "name": "employer", "value": employer.value },
{ "name": "error_type", "value": error_type.value },
{ "name": "status", "value": status.value },
{ "name": "phase", "value": phase.value },
{ "name": "extract", "value": extract.value }
);
$.getJSON( sSource, aoData, function (json) {
/* Do whatever additional processing you want on the callback, then tell DataTables */
fnCallback(json)
} );
}
}).fnSetFilteringDelay(1000);
});
[/code]
SO Yeah I need to get this working in IE6 (which your demos do work in IE6!) Otherwise I will be having to go my separate way for this project.
This discussion has been closed.
Replies
The first thing that comes to mind here is - does your JSON return from the server-side processing have exactly six elements (I'l add a counter to the output of that error in future!). If so, are you sure that there is no trailing comma on the data - IE can trip over that. Does your JSON return validate (jsonlint.com). And finally - do you have a link we could see this happen with?
Thanks,
Allan
Fixed that issue... However for some reason IE shows up with the selected colors not the default colors before click on them...
Uses these:
[code]
table.display tr.row_selected.odd td {
background-color: #B0BED9;
}
table.display tr.row_selected.even td {
background-color: #9FAFD1;
}
[/code]
instead of these:
[code]
tr.odd {
background-color: #FFFFFF;
}
tr.even {
background-color: #DEDEDE;
}
[/code]
Good stuff - glad to hear that worked :-).
So the CSS issue - the statements it is applying are basically "AND" statements (if the TR is "row_selected" and "odd"...) which IE6 has poor support for. I think it can be made to work, but it takes a lot of fiddling and it's different for lots of different cases. IE7 and everything else supports this kind of statement, which is why I've left it in the default styles.
To fix it, the easiest way is just to delete those "row_selected" styles. Unless you need them of course - if you do then you'll need to alter how that class is added to allow for IE (i.e. concatenate the two together).
Regards,
Allan
[code]
table.display tr.row_selected td {
background-color: #B0BED9;
}
[/code]
Tried to pull the odd or even tag but for some reason the even would now work.
However 1 color will work!