jQuery AJAX Refresh in an iFrame

Tinkering around with a jQuery enabled Drupal module today, I was trying to make an iFrame that continuously updated. I tried the typical meta-tags and window.location.refresh() javascript but I wasn't satisfied with constant progress bar on the page. An AJAX (or AHAH really) request was needed to make this work smoothly. The trick was combining some standard javascript selectors with the jQuery $ function. Here's my iframe:
<iframe name="script-console" id="script-console" src="console.html"></script>
And this is what was needed to select the top-level HTML tag within my iframe. Note that the 'script-console' used below is the name attribute of the iframe, not the id.
$('html', window.frames['script-console'].document);
So now to actually add the jQuery request and modify the iFrame:
  function refreshConsole() {
    $('body', window.frames['script-console'].document).loadIfModified("mytextfile.txt");
    setTimeout("refreshConsole()", 1000);
  }
 
  $(document).ready(function() {
    refreshConsole();
  });
This code (placed the HEAD tag of the page), defines a refreshConsole function. Every second (1000 milliseconds), refreshConsole calls itself again. Every call, jQuery check the file "mytextfile.txt" for changes. If it's been updated, it retrieves the text and replaces the contents of the iFrame's BODY tag.

Hi there,

first of all thanks for sharing your code and help with jquery issues that sometime make us loose time to finishing tasks in a reasonable time.

I have the next problem,

I have a form with input elements, and I want to fill the input elements when the iframe is load. I'm trying to use

- javascript that is sit in the mail document that contains the iframe

$(window.frames['my-iframe'].document).ready(function() {

text = "testing"
updatevalue(text);

}

updatevalue(text) {

$('input#some-text', window.frames['my-iframe'].document).attr({
value: text,
});
}

- html of the document inside the iframe:

Testing jquery

Problem: works in firefox and safari if I call the function from the , but IE send an error message that is:

"Line xx
Char: 1
Error: Object doesn't support this property or method
Code: 0
URL: http://mysite.com/somethig"

Am I losing something?

cheers,

Marta

Does it successfully update the pics as well, cus that's a major problem for me with surfit.se, especially with FireFox.

I hope this is right place to ask :)

I have been having some problem someone described here: http://groups.google.com/group/jquery-ui/browse_thread/thread/935be641b3...

Does anyone knows solution to this?\
Thanks in advance.

thank you

Thanks for the iframe code.

hi;

thanks for sharing the code .

how can I add something like

waitRequesting updated content...

so when the script refreshes the screen , the

waitRequesting updated content...

will appear until new data is displayed

thanks
jeff

Post new comment

The content of this field is kept private and will not be shown publicly.
  • Allowed HTML tags: <a> <div> <img> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd> <i> <b>
  • Lines and paragraphs break automatically.
  • You may post code using <code>...</code> (generic) or <?php ... ?> (highlighted PHP) tags.
  • Web page addresses and e-mail addresses turn into links automatically.

More information about formatting options

CAPTCHA
This question is for testing whether you are a human visitor and to prevent automated spam submissions.
Image CAPTCHA
Copy the characters (respecting upper/lower case) from the image.