Default DataTable does not work
Default DataTable does not work
I am using dataTables in my MVC app. I used the default table on one table. It worked fine. Then I used it on a different table it it breaks each time with "FundDocsView is undefined.
[code]
[/code]
later on the same view
[code]
@Scripts.Render("~/Scripts/jquery.dataTables.js")
$(document).ready(function () {
$('#FundDocsView').dataTable();
});
[/code]
Jquery and JQueryUI are included on _Layout.cshtml
I don't see what I am doing wrong.
[code]
[/code]
later on the same view
[code]
@Scripts.Render("~/Scripts/jquery.dataTables.js")
$(document).ready(function () {
$('#FundDocsView').dataTable();
});
[/code]
Jquery and JQueryUI are included on _Layout.cshtml
I don't see what I am doing wrong.
This discussion has been closed.
Replies
Allan
And even if I were to deploy it as is, you would have to have DoD clearance, be issued a CAC card, and access the site from the .mil domain to see any of the servers to which I have access.
How about if I provide you with screen shots with the errors.
Failing that how about providing the project with the databases?
Update on the error. Turns out there was another incomplete set of JavaScript tags at the top of the page which had only the word "FundDocsView" in them.
After removing that I get the following error:
[code]DataTables warning (table id='FundDocsView'): Requested unknown parameter '1' from the data source for row 1
[/code]
This occurs at line 669 in the jquery.dataTables.js file
[code]
/* Classes */
if ( bClass )
{
nCell.className += ' '+oCol.sClass;
}
[/code]
Tried using code from here
http://datatables.net/forums/discussion/13163/is-it-possible-to-set-a-cell-class-and-colspan-in-aadata#Item_3
but that still delivered the same error.
at https://www.datatables.net/forums/discussion/comment/43012#Comment_43012
Roy Ling provided code to manually use fnRowCallback to manually add a colspan attribute and remove the place holder cells. However it appears you need to know the row that requires this treatment to call the function, and the attribute colspan, can not be in the cell. I am going to try to combine the two sets of code to use one to locate which row needs to be altered and the the other to do the altering.
Should be interesting
Then I set the document.Ready() function as below:
[code]
$(document).ready(function () {
$('#FundDocsView').dataTable({
"fnRowCallback": function( nRow, aData, iDisplayIndex, iDisplayIndexFull ) {
alert("got here first");
if($(nRow).attr("id*=Sub")) {
alert("got here");
var iCol = $(nRow).children('td').length;
$(nRow).children('td:gt(0)').remove(); // remove empty placeholder cells
$(nRow).children('td:first').attr('colspan', iCol);
}
}
});
});
[/code]
Unfortunately this did not work. I don't know whether the if clause failed to find the id attribute of tr or if the if clause never got called. I put a breakpoint on that line but no break ever occurred. But when I put a break point on the document.ready function no break occurred there either, but I know it is running because the HTML table is being rendered as a dataTable. So as you can see I put in a couple of alerts. "Got here first" fired twice one for each row. "Got here" never fired.
[code]
if ($(nRow).attr("id").toString().indexOf("Sub") != -1) {
[/code]
Now all is working as designed.
See code too accomplish this below:
[code]
$(document).ready(function () {
$('#FundDocsView').dataTable({
"aaSorting" : []
});
$('#PRView').dataTable({
"aaSorting": []
});
$('#ContractsView').dataTable({
"aaSorting": []
});
$("#FundDocsView").treetable({ expandable: true });
$("#PRView").treetable({ expandable: true });
$("#ContractsView").treetable({ expandable: true });
});
[/code]
Looks really good.