0

I have the following scenario in a HTML web page, using Firefox 31.0. A frameset containing frames, and a button that does some evaluation/functionality. My problem is I want to reload one of the frames after submitting a POST form. See picture for general layout of the frames.

enter image description here

The HTML-Form in frame "edit" look like:

<form name="edit_this" id="edit_this" action="http://example.com" method="post">
    <input type="hidden" name="fnc" value="" id="fnc">
</form>

The button HTML looks like this one:

<button onclick="process('uninstall');">Uninstall All Modules</button>
<!-- this line is used to try a javascript reload in the function below--> 
<a id="reload" target="base" href="http://example.com" />

The javascript function called look like:

 function process(fnc) {
        document.getElementById('fnc').value = fnc;
        document.getElementById('edit_this').submit();

        // none of the following work
        document.getElementById('reload').click();
        top.base.src="http://example.com";
        top.base.location.reload();
    }

All three ways of loading the frame fails for some reason, eg the 

document.getElementById('reload').click();

(re)loads the frame "base" and it's sub-frameset properly but the POST data seems not to reach the server. It seem's the "click()" execution interrupts the previous POST. Network tracking with firebug show's the POST request remains unreplied by server, but the subsequent "click()" request ist managed properly.

and for 

top.base.src="http://example.com";

the processing on the server happend, but the frame is not reloaded (at all) and remains unchanged.

and the 

top.base.location.reload();

is a major problem, as it's going to send the POST data again, which is not applicable to application logic.

I've tried these with no avial, maybe some one knows how to deal with it.

Thank you.

Update: I've found a possible solution to the problem by using setTimeout like so:

setTimeout(function(){document.getElementById('reload').click();}, 200);

this give's the client/server time to respond to POST and works fine, but It seem's bit hackish, eg. what happend under heavy-load scenarios, will be 200ms enough?, etc... So my question is still open, I guess.

LikeYou
  • 500
  • 1
  • 6
  • 20
  • Ummm, so I replicated your setup here: http://jsfiddle.net/xf1dhorw/ and when I click the button, the page successfully submit to example.com. This seems like the correct behavior. What were you expecting? – joeltine Aug 09 '14 at 16:00
  • Yes, it will may be work in the example, because the POST data is not processed by example.com, and returns immediately an "all good" 200. But the PHP process on a server takes some 100ms to process, and in my case the server even did not deliver any response header. – LikeYou Aug 09 '14 at 16:09
  • It sounds like this is a server issue. Have you verified the URL you're sending your POST to is handled properly by the server? – joeltine Aug 09 '14 at 16:18
  • Yes, I did. The POST URL had worked before, and without the extra functionality in the "process" function above - all good. – LikeYou Aug 09 '14 at 16:24
  • BTW did you notice the typo here "top.base.src="http://eample.com";". "eample.com" not "example.com" – joeltine Aug 09 '14 at 16:24

1 Answers1

1

I suggest submitting the form using jQuery like described in this answer : https://stackoverflow.com/a/1200312/1321810

by doing this you can attach a handler that can reload the page at the moment when the post has completed, and not wait exactly 1000ms

Community
  • 1
  • 1
Saad Bourziza
  • 133
  • 3