Welcome to WebmasterWorld Guest from 174.129.151.95

Forum Moderators: open

Message Too Old, No Replies

referencing a table in an iframe with sortables js

   
2:56 pm on Dec 8, 2009 (gmt 0)

5+ Year Member



Hi everyone

My JavaScript skills are pretty much zero and this problem has been hounding me for the past few days and I've even asked some of the developers that work with me for help, but I've had no luck yet.

Anyway, I am trying to reference a table with class="sortable" that loads within an iframe name="iframecontent" from the parent window. I have a sortables js function, but I can't get it to 'see' the sortable table in the iframe.

The original line of code where it looks for sortable tables looks like this:

var tables = getElementsByClassName(document, "table", "sortable");

And this is the point at which the JS stops working - I have tried a bunch of variations on this, but haven't got it working.

Please could someone help me?

Thanks a lot.

9:20 pm on Dec 8, 2009 (gmt 0)

WebmasterWorld Senior Member whoisgregg is a WebmasterWorld Top Contributor of All Time 10+ Year Member



Welcome to WebmasterWorld, richelectron!

getElementsByClassName only takes one value. To chain them together, you'd use a construct like this:

var tables = document.getElementById('iframecontent').getElementsByClassName('sortable');
10:02 am on Dec 9, 2009 (gmt 0)

5+ Year Member



Thanks for the help whoisgregg :)

When I use the construct that you supplied above, then I get a Error: document.getElementById("wikiframe") is null in the error console.

I was thinking this might be because the iframe hadn't loaded when the JS was trying to execute and couldn't find it?

I included the JS in the page that loads in the iframe and added a called to the sortables function right at the bottom of the page in the iframe, but no joy...

Any ideas?

2:55 pm on Dec 9, 2009 (gmt 0)

WebmasterWorld Senior Member whoisgregg is a WebmasterWorld Top Contributor of All Time 10+ Year Member



It could be that it hasn't loaded yet. If that's the case, make sure your javascript code is attached to the onload event of the page. This thread [webmasterworld.com] has some code that can help with that.

Also, make sure your iframe has that "id" set and not just a "name" ;)

11:33 am on Dec 10, 2009 (gmt 0)

5+ Year Member



Thanks for helping with this whoisgregg, I got this working.

I wasn't actually doing this exactly as I had explained in my second post. I had inserted the call to the function in a part of the code that wasn't actually loading - so I inserted an alert as well and moved the code to a section of the page where I could see the alert.

Basically I included the js function in the page that loads in the iframe and then called the function right at the bottom of the page that loads in the iframe - This allowed me to search for the sortable class by using the following construct: document.getElementsByClassName("sortable"); - much simpler and it works great!

This has made my day :)

1:53 pm on Dec 10, 2009 (gmt 0)

WebmasterWorld Senior Member whoisgregg is a WebmasterWorld Top Contributor of All Time 10+ Year Member



Glad you got it sorted! :)
2:04 pm on Dec 10, 2009 (gmt 0)

5+ Year Member



Update: I had to implement this updated getElementsByClassName function <snipped URL> for cross browser compatibility.

Thanks again.

[edited by: whoisgregg at 5:41 pm (utc) on Dec. 10, 2009]
[edit reason] Whoops, no URLs please. See TOS [webmasterworld.com] :) [/edit]