Solved

Reload specific iframes using jQuery

Posted on 2011-03-02
4
1,282 Views
Last Modified: 2012-05-11
Hello Experts,

I have several iframes placed within a page.
I hide and show the iframes depending on whether the user is logged in or not.
Currently, when they log in - I show all the 'logged in' specific iframes
and hide all the 'not logged in' specific iframes (and vice versa).

However, I need all the 'logged in' iframes to reload as they show new details as soon as the user logs in.
If I have
<iframe id='iframe1-in' src='a.php' />
<iframe id='iframe1-not' src='a1.php' />
<iframe id='iframe2-in' src='b.php' />
<iframe id='iframe2-not' src='b1.php' />

How can I force iframe1-in and iframe2-in to reload their respective src files?

Thanks!
0
Comment
Question by:jagku
4 Comments
 
LVL 5

Accepted Solution

by:
h4mi earned 250 total points
ID: 35018237
$('#iframe').each(function() {
 this.contentWindow.location.reload(true);
});
0
 
LVL 19

Assisted Solution

by:Bardobrave
Bardobrave earned 250 total points
ID: 35018277
I always strongly recommend not to use iframes into any webpage.

Iframes are deprecated by W3C and it's use probably won't be supported in a near future by browsers.

However, to answer your question. I supose you can force a reload of the file reloading the own iframe object, so something like:

getElementById("iframe1-in").contentDocument.location.reload(true);

should work.
0
 
LVL 7

Expert Comment

by:JosephEricDavis
ID: 35018406
You should just be able to use jQuery to reset the src attribute on the tag.

Take a peek at the html doc below.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>Untitled Page</title>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
    <script type="text/javascript">
        $(function () {
            $('#btnRefresh').click(function () {
                $('#testFrame').attr('src', 'http://www.kc-soccer.com');
                return false;
            });
        });
    </script>
</head>
<body>
    <input id="btnRefresh" type="button" value="Refresh" />
    <iframe id="testFrame" src="http://www.kc-soccer.com" />
</body>
</html>

Open in new window

0
 

Author Closing Comment

by:jagku
ID: 35018548
Hi,

Many Thanks.
I have marked the first one as the best solution - because this is the first response I got. The other one also works.

Bardobrave - you mention iframes have been deprecated by W3C. When was is deprecated?
0

Featured Post

3 Use Cases for Connected Systems

Our Dev teams are like yours. They’re continually cranking out code for new features/bugs fixes, testing, deploying, testing some more, responding to production monitoring events and more. It’s complex. So, we thought you’d like to see what’s working for us.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

OverviewThis article demonstrates a simple search form using AJAX. The purpose of the article is to demonstrate how to use the same code to render a page and javascript (JQuery) and AJAX to make subsequent calls to refine the results. The princip…
In this article you'll learn how to use Ajax calls within your CodeIgniter application. To explain this, I'll illustrate how to implement a simple contact form to allow visitors to send you an email through your web site.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

777 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question