Buttons work in IE and Chrome, but shock horror, not Firefox!

melph

I am so used to everything working in Firefox and not IE, that to come across this situation is quite unusual.

If I view any of the table tools demos, all buttons will work BUT not in Firefox (version 13 is what I am using) - any ideas?

I have uninstalled Firefox, reinstalled, checked latest flash player installed using Adobe website, but still the same problem.

Has anyone else come across this and if so, is there a fix \ work around.

Many thanks -

Mark

corpo

The same here, w/ firefox 13

Tried disabling plugins not to avail.

Tried latest version of ZeroClipboard (DataTables uses a modified 1.04 ZeroClipboard, latest ZC is 1.07), still works on FF 13. Tried ZC 1.04 on FF13, works too.

I'm a bit puzzled. Looking with FireBug, the flash element is there, rightly positionned, but no event is firing when clicking on it.

Edit: I'm in the process on fixing that. Moving the flash element outside of the parent makes the button active. Have a few positionning issues to fix before giving the fix.

melph

I spent 5 hours on this last night - only thing I couldn't try was an older version of Firefox. Would be interesting if someone could do so and post results here.

corpo

So, here's the fix :)

You have to edit ZeroClipboard.j. Patches are against "1.0.4-TableTools2"

Look at the comments at the end of modified lines

Line 112, add this line
[code]
// find X/Y position of domElement
var box = ZeroClipboard_TableTools.getDOMObjectPosition(this.domElement);
var box_parent = ZeroClipboard_TableTools.getDOMObjectPosition(this.domElement.parentNode); // added line
[/code]

Line 119 (former line 118), replace those 2 lines
[code]
style.left = '' + (box.left - box_parent.left) + 'px'; // was style.left = '0px';
style.top = '' + (box.top - box_parent.top) + 'px'; // was style.top = '0px';
[/code]

And line 134 (former line 133) change this line
[code]
if ( this.domElement ) {
this.domElement.parentNode.appendChild(this.div); // was this.domElement.appendChild(this.div);
this.div.innerHTML = this.getHTML( box.width, box.height );
[/code]

And voila :)

melph

Hi

Tried the workaround and it is crashing my table - if i get time (my daughter is demanding my attention!) I will post what my ZeroClipboard code looks like as it would appear different to those quoted (although I am using teh same version of Zero Clipboard)

melph

OK

So the first mod, add a line at line 112 is fine,
[code]
// find X/Y position of domElement
var box = ZeroClipboard.getDOMObjectPosition(this.domElement);
[/code]
As such, we add your line below the above, so it looks like:

[code]
var box = ZeroClipboard_TableTools.getDOMObjectPosition(this.domElement);
var box_parent = ZeroClipboard_TableTools.getDOMObjectPosition(this.domElement.parentNode); // added line
[/code]


OK, so original lines at 118 look like:

[code]
style.left = (this.domElement.offsetLeft)+'px';
//style.left = (this.domElement.offsetLeft+2)+'px';
style.top = this.domElement.offsetTop+'px';
[/code]
So from your modification we erase all above 3 lines and replace with the two lines in your mod?

TO BE CONTINUED IN NEW COMMENT.......

melph

Oh, the version of ZeroClipboard I am using was taken from version 2 of table tools and the version for the file taken from line 6 is "version: "1.0.4-mod","

Finally, this is the workaround that is causing me the most trouble. If I go to line 134 we have:

throw( 'Unable to load SWF file - please check the SWF path' );

which must be wrong.

I can find a similar line to what you have mentioned, this shows as line 130. The code from line 129 to 136 (original lines) looks like this:

[code]
// style.backgroundColor = '#f00'; // debug
this.domElement.parentNode.appendChild(this.div);

this.div.innerHTML = this.getHTML( box.width, box.height );
this.loadingTimer = setTimeout( function () {
throw( 'Unable to load SWF file - please check the SWF path' );
}, 10000 )
},
[/code]

I am struggling to insert your final code - if I add it at this.domElement.parentNode.appendChild(this.div); it then throws the table.

I must be doing something wrong - any ideas?

melph

Look at this thread - an answer has been found - need to use the ZeroClipboard from Table Tools version 2.0.3

http://datatables.net/forums/discussion/10345/tabletools-csv-export-only-working-in-chrome#Item_10

corpo

My ZeroClipboard.js is from TableTools-2.1.1.zip

Full file here : http://www.1st-files.com/e9qboxa404rk

corpo

Just noticed the author updated the 2.1.1 release with a fix for this issue

allan

Actually it will be 2.1.2 which fixes this issue - 2.1.1 unfortunately carries the same bug. The 2.1.2 development image can be obtained from the downloads page (as the "nightly") or from Github. I'll be releasing 2.1.2 to address this issue shortly.

It would be great if as many people as possible could try 2.1.2.dev and let me know how you get on with it so I can be absolutely certain that this is addressed (I'm confident that this issue has been now - but you never know!).

Allan

melph

Hi Allan

I have downloaded the 2.1.2 DataTables.js and uploaded to my server -

My table now displays text links rather than buttons? But, the links for CSV PDF etc do actually now work in FIrefox 13. Before I go looking into the loss of buttons, if this something to do with the nightly build or another problem?

Thanks

Mark

melph

Just tried it in IE9 - same issue, no buttons but also the links for PDF \ CSV \ EXCEL don't work here.

Allan - I hope this is not something with my set up as I don't want to think you spend ages on this only to find it is something to do with my code.

If it helps at all, I am using the following button codes:

[code]
"aButtons": [


{
"sExtends": "copy",
"bSelectedOnly": true,
"bShowAll": false
},

{
"sExtends": "print",
"bShowAll": false,
"sMessage": "Generated by Surrey Birders"
},




{
"sExtends": "collection",
"sButtonText": "Save",
"aButtons": [ "csv", "xls", "pdf" ]
},


]
}
[/code]

allan

The fact that the buttons are no longer using tags, but rather tags is entirely intentional. As noted above, IE and Firefox have issues with Flash inside button tags, so the button tag is not an option unless only Webkit is being used. So I had a choice between going with tags or s for the TableTools buttons. DIVs are semantically meaningless so I went with the tag. You can change that using:

[code]
TableTools.DEFAULTS.oTags.button = "div";
[/code]

if you want, but I'd suggest against it, for the same reason that I didn't put that in as the default.

You might well need to update your TableTools CSS to take this tag change into account, but unfortunately with the IE / Firefox issue, I see no way around that :-(.

Allan

melph

There's a report on BBC news today about flash issues related to Firefox 13 and windows 7 / vista.

allan

References:
http://www.bbc.co.uk/news/technology-18495965
http://support.mozilla.org/en-US/kb/flash-113-doesnt-load-video-firefox

However, that sounds specifically like a video problem, and I don't think it will cause TableTools issues.

Allan

eddt

Updating to 2.1.2dev and getting the latest versions of everything fixed the problem I was having with my buttons not working. Thanks Allan for being so on top of this!

allan

Excellent - thanks for the feedback eddt!

I'm planning to release 2.1.2 tomorrow, so if anyone else has any feedback on this topic - now is the time!

Allan