What is this, and why doesn't it work??
What is this, and why doesn't it work??
Okay, I know what it is... It's JQuery :
var row;
row = itemTable.$('tr.row_selected');
And it is crashing, telling me "Uncaught TypeError: undefined is not a function"
Of course "undefined" doesn't tell me anything, but after a few days, I managed to figure out it was referring to the '$'
I replaced it with the actual word "JQuery", but that still doesn't help.
See, the problem is that it doesn't work in project B, but worked in project A.
Same script includes before my code. Same order. Same everything.
My initialization code looks like this, and works fine. I manually add a rows with "itemTable.fnAddData(..) " :
var itemTable; // global... no prob....
$(document).ready(function() {
// other stuff....
InitializeTable();
$('#scannedItemsList').find('tbody').on('click','tr',RowSelect); // add my click event to select a row
});
/* The Table has 7 columns */
function InitializeTable() {
var tableInit = {}; /* Build an initialization object */
/* Now, insert all the other settings needed for the initialization object */
tableInit.sPaginationType = "full_numbers";
tableInit.oLanguage = {
"sLengthMenu": "Display _MENU_ items per page",
"sZeroRecords": "No entries to display",
"sInfo": "Showing _START_ to _END_ of _TOTAL_ Items",
"sInfoEmpty": "Showing 0 to 0 of 0 items ","sInfoFiltered": "(filtered from _MAX_ Total items)"
};
> tableInit.aoColumns = [<br>
null, null, null,null, null, null, { "sClass" : "leftJust" } /* all 7 columns*/
];
/* And init the table, returning the table object into a global */
itemTable = $('#scannedItemsList').dataTable( tableInit);
}
!!!!!!!!!!!!!!!!! ODD... THE ABOVE JQUERY CODE WORKS, BUT THE ONE IN MY "RowSelect" CRASHES !!!!!!!!!!!
/* This was derived from the samples on this site...
and works in project A, but now, 3 months
later in project B, it is crashing JS */
function RowSelect() {
// remove ALL 'row_selected' end 'edit_mode' classes from the table
var row;
row = itemTable.$('tr.row_selected');
!!!!!! CRASH !!!!!!!!!
Does anyone have any idea why one works, and the other doesn't? Why it knows what "$" means on line 44 in my code, but suddenly doesn't know what "$" means on line 52, a function later?
This is really driving me to drink!
-Scotty
Replies
In fact.... Just look here. It's stripped down version of the issue.
http://www.csweber.com/BrokenTables/broken.html
Just open up the page, open a JS debugger session, and click on the row that was manually added. It traps at the
With
That's a properly old version of DataTables. The
$
method you are trying to use wasn't in that version it would appear. I'd suggest updating.Allan
Upgraded to 1.9, as the other apps use it. Seemed to solve it. I'm not sure how 1.8 leaked in. Our source control is supposed to have it locked down
We can't just randomly upgrade without weeks of regression testing.
We tried that once, and going from JQuery 1.7 to 1.8 broke a bunch of stuff.
I spoke too soon. Now it broke something else.
The page buttons are now just a smear...
Here are two screen shots I spliced together.
Same everything, except swapping out the JS from 1.8 to 1.9
http://www.csweber.com/broken/screenshots.jpg
Are you referencing the appropriate CSS files in your HTML?
? The 'appropiate' ?
The CSS is unchanged. All I did was replace the jquery.,datatable.js from 1.8 to 1.9
And where can I find the support tutorials, demos, etc for 1.9? There used to be support info for it. Now it's all gone.
Maybe 1.9 has different CSS.
First page of the manual links to legacy docs.
http://datatables.net/manual/index
If you need to keep use 1.8, use fnGetNodes which will be in the very old versions and run your jQuery selector on the returned array.
Yup. You need to use the same version of the CSS as your Javascript. See also the upgrade notes for each major version:
Allan
Well, I am trying to implement a new app based on the already approved version of 1.9 that we are using. We don't have months and months to regression test an updated version.
All through the JS and CSS code are comments (what a novel idea!!) that explain what it is doing, and links to the material.
All the links are now dead.
Oh well.
Actually, most of the old links should redirect to the new pages, but there was an error in the redirect configuration. Thanks for flagging that up.
The specific one you link to isn't quite the same as before and I've still to write that new page. Until then the legacy site contains that information.
Allan