No DataTable wrapper, no DTT_Container, no length, no filter, no sort when users logged out
No DataTable wrapper, no DTT_Container, no length, no filter, no sort when users logged out
In Chrome when I use the Developer Tool to inspect the DOM I notice that when I am logged into my WordPress installation the DataTables wrapper div and various DTTT divs exist. However, they do not exist when I am logged out.
As an aside, I observed that none of these divs show up when I click View page source in Chrome. So I am assuming that View page source displays only the HTML rec'd by the browser whereas the Developer tool displays the DOM after it's been manipulated, presumably by some JavaScript.
Where should I look to find out why these divs are not being added to the DOM? I'm assuming that some JavaScript is not running when the divs, length, filter are not displaying and the column sorting does not work. What JavaScript file needs to be included, or what JavaScript code needs to executed in order for the divs to be added? The HTML page source of both the logged-out and logged-in versions of the web page are the same. I double checked to ensure they both contained configuration code e.g.
[code]
var myDataTable = {
//"bJQueryUI": true,
"sPaginationType": "full_numbers",
"sDom": 'T<"clear">lfrtip',
"aoColumnDefs": [
{ "bSortable": false, "aTargets": [ 2,3 ] }
],
"oTableTools": {
"sSwfPath": "/wp-content/TableTools-2.1.5/media/swf/copy_csv_xls_pdf.swf",
"aButtons": [
"copy",
"print",
{
"sExtends": "collection",
"sButtonText": "Save",
"aButtons": [
{
"sExtends": "csv",
"sButtonText": "Excel (CSV)",
"bFooter": false,
"sFileName": "download.csv"
},
{
"sExtends": "xls",
"sButtonText": "Excel (TSV)",
"bFooter": false,
"sFileName": "download.tsv"
},
{
"sExtends": "pdf",
"bFooter": false,
"sFileName": "download.pdf"
}
]
}
]
},
"oLanguage": {
"sSearch": "Search columns:"
}
[/code]
The both contain the script tags e.g.
[code]
$(document).ready
(
function() { $('#cemetracDataTable').dataTable(myDataTable); }
);
[/code]
As an aside, I observed that none of these divs show up when I click View page source in Chrome. So I am assuming that View page source displays only the HTML rec'd by the browser whereas the Developer tool displays the DOM after it's been manipulated, presumably by some JavaScript.
Where should I look to find out why these divs are not being added to the DOM? I'm assuming that some JavaScript is not running when the divs, length, filter are not displaying and the column sorting does not work. What JavaScript file needs to be included, or what JavaScript code needs to executed in order for the divs to be added? The HTML page source of both the logged-out and logged-in versions of the web page are the same. I double checked to ensure they both contained configuration code e.g.
[code]
var myDataTable = {
//"bJQueryUI": true,
"sPaginationType": "full_numbers",
"sDom": 'T<"clear">lfrtip',
"aoColumnDefs": [
{ "bSortable": false, "aTargets": [ 2,3 ] }
],
"oTableTools": {
"sSwfPath": "/wp-content/TableTools-2.1.5/media/swf/copy_csv_xls_pdf.swf",
"aButtons": [
"copy",
"print",
{
"sExtends": "collection",
"sButtonText": "Save",
"aButtons": [
{
"sExtends": "csv",
"sButtonText": "Excel (CSV)",
"bFooter": false,
"sFileName": "download.csv"
},
{
"sExtends": "xls",
"sButtonText": "Excel (TSV)",
"bFooter": false,
"sFileName": "download.tsv"
},
{
"sExtends": "pdf",
"bFooter": false,
"sFileName": "download.pdf"
}
]
}
]
},
"oLanguage": {
"sSearch": "Search columns:"
}
[/code]
The both contain the script tags e.g.
[code]
$(document).ready
(
function() { $('#cemetracDataTable').dataTable(myDataTable); }
);
[/code]
This discussion has been closed.
Replies
[code]"bSortable": false, "aTargets": [ 2 ][/code]
to this
[code]"bSortable": false, "aTargets": [ 2,3 ][/code]
When logged in, the user can view 4 columns. When logged out, the user can only see 3 columns. So when I changed bSortable such that the fourth column should also not be sortable the above-mentioned problems occurred.
Problem resolved.