Hakan
Hakan

Reputation: 3885

Reload page after submit in iframe (javascript/jquery)

I have a page with an iframe. In the iframe there’s a submit button. When I click the submit button I want the parent window to be updated. This is what I have done so far, and it works (the javascript is located in the parent window):

var myFrame = $('iframe');
myFrame.load(function() {
myFrame.contents().find('#publish').click(function() {

  myFrame.load(function() {
    location.reload();
  });

});
});

The code works. But I find the reload of the iframe unnecessary. Is there a better way to detect when "submit" is completed?

(I can’t reload the page only by “onclick” or relay on any delay. I must be sure that the submitting of the form is finished)

Upvotes: 6

Views: 10976

Answers (3)

Preeti
Preeti

Reputation: 1

$("#publish").click(function() {
    $('#inputs').ajaxSubmit({
        success:function(){
            //alert("Reload called");
            parent.location.reload();
        }
    });
 });

This worked.

Upvotes: 0

two7s_clash
two7s_clash

Reputation: 5827

You could have the form submission return a block of js:

<html>
<script>
 window.parent.document.jQueryFunction();
</script>
</html>

or, if you're open to plug-in, you could use the ajaxSubmit() method of the jQuery Form Plugin.

$myFrame.contents().find('form').ajaxForm({
  success: function() {
     // update parent
  }
});

Upvotes: 0

Naveed Ahmad
Naveed Ahmad

Reputation: 3175

Assuming publish is unique you can simply do so:

$(document).ready(function(){
  $('#publish').live('click', function(e){
     e.preventDefault();
     //Do whatever you want here
   });
});

Notice the live will bind the even to publish link at runtime.

Upvotes: 0

Related Questions