homepage Welcome to WebmasterWorld Guest from
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member

Visit PubCon.com
Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
Forum Library, Charter, Moderator: open

JavaScript and AJAX Forum

referencing a table in an iframe with sortables js

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

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)

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)

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)

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)

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)

Glad you got it sorted! :)


 2:04 pm on Dec 10, 2009 (gmt 0)

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]

Global Options:
 top home search open messages active posts  

Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved