TableTools Export Buttons do nothing in IE or Chrome in JQuery UI Modal (Updated: Fixed)

Obbi

I have a dialog that's loading in the table from a partial view made in ASP.NET MVC3. Used to work fine, but now the export buttons just don't do anything in IE or Chrome. No errors, no responses, other than the script blocks that generate that look something like this:

[code] try { document.getElementById("ZeroClipboardMovie_4").SetReturnValue(__flash__toXML(ZeroClipboard.dispatch("4","mouseOut",null)) ); } catch (e) { document.getElementById("ZeroClipboardMovie_4").SetReturnValue(""); }[/code]

Here's the code of the DataTable being made:

[code]
$(function () {
tableId = '#' + $('.dialogDataTable').attr('id');
$(tableId).dataTable({
"sScrollX": "100%",
"sScrollXInner": "100%",
"bScrollCollapse": true,
"bJQueryUI": true,
"sPaginationType": "full_numbers",
"asStripeClasses": [stripe1, stripe2],
"sDom": 'R<"H"Tlfr>t<"F"ip>',
"oTableTools": {
"sSwfPath": mainRoot + "Scripts/DataTable/TableTools/copy_cvs_xls_pdf.swf",
"aButtons": [
{
"sExtends": "csv",
"sButtonText": "Save as CSV"
},
{
"sExtends": "pdf",
"sButtonText": "Save as PDF",
"sPdfOrientation": "landscape",
"sPdfMessage": $('.dialogDataTable').attr('id') + " " + new Date()
}
]
}
});
});
[/code]

any inputs on this would be greatly appreciated, because I'm getting stumped on this.

Obbi

I should note when placed in the Index page that handles everything, it's able to export fine. The partial view file is located in the same folder as the Index, however, so the sSwfPath should be just as valid.

Another note is while monitoring the script blocks that fire from ZeroClipboard, "eval code" shows up that simply has "undefined" listed. Not sure what that's about.

Obbi

Update: It appears to be less about MVC and more about dynamically constructing the table in general.

Also, this is a problem specifically for IE9 and Chrome, earlier versions work.

So is this a new glitch on TableTools end or is there a more solid way of dynamically constructing a datatable?

allan

Forgive my ignorance, but what is a partial view? The code above looks like it should work okay...

Can you link to your example please?

Allan

Obbi

It's sorta similar to a PHP include. Anyway, that setup doesn't seem the issue as much as just getting tabletools to function properly within a JQuery UI dialog.


I currently don't have a page around that I can link to. I'll get one going later today and get back to you on that.

Obbi

Update with a solution!

Turns out I was looking at it all wrong. JQuery UI has a bug where if ran in a modal, it removes the click functions from certain elements due to its default z-index.

My solution was to set zIndex: 1 like so

[code]$('.dialog').dialog({
modal: true,
zIndex: 1
});[/code]

I'm not entirely sure at what point the modal's overlay zIndex stopped intruding upon TableTools, I just grew impatient.

allan

heh - thanks for the update! I'll keep this in mind should anyone else report this as well.

Regards,
Allan