I've been working so much on this and making zero progress I'm about to freak out. Please help!

Below is the code.

I want the TARGET attribute of the form to change from target="frame1" to target="frame2" then target="frame3" and so on, unlimited AFTER a form is submitted. The form is submitting these to iframe so the page is not refreshing after every submit.

Can anyone help?

<div id="container">
<div id="scan">
  <form method="post" id="auditRepairForm" name="auditRepairForm" action="" target="changeTarget()">
    <input name="scanID" id="scanID" value="12345678" onFocus="this.value=''" />
    <input name="fromLaunchScreen" id="fromLaunchScreen" type="hidden"/>
    <input type="submit" id="SubmitForEdit" style="display:none;"/>
  </form>
</div>

<div class="outerdiv">
<iframe name="frame1" class="inneriframe"></iframe>
</div>

<div class="outerdiv">
<iframe name="frame2" class="inneriframe"></iframe>
</div>
<div class="outerdiv">
<iframe name="frame3" class="inneriframe"></iframe>
</div>
<div class="outerdiv">
<iframe name="frame4" class="inneriframe"></iframe>
</div>
<div class="outerdiv">
<iframe name="frame5" class="inneriframe"></iframe>
</div>
<div class="outerdiv">
<iframe name="frame6" class="inneriframe"></iframe>
</div>
<div class="outerdiv">
<iframe name="frame7" class="inneriframe"></iframe>
</div>
<div class="outerdiv">
<iframe name="frame8" class="inneriframe"></iframe>
</div>
<div class="outerdiv">
<iframe name="frame9" class="inneriframe"></iframe>
</div>
<div class="outerdiv">
<iframe name="frame10" class="inneriframe"></iframe>
</div>

</div>

I've been working so much on this and making zero progress I'm about to freak out. Please help!

Below is the code.

I want the TARGET attribute of the form to change from target="frame1" to target="frame2" then target="frame3" and so on, unlimited AFTER a form is submitted. The form is submitting these to iframe so the page is not refreshing after every submit.

Can anyone help?

<div id="container">
<div id="scan">
  <form method="post" id="auditRepairForm" name="auditRepairForm" action="https://example.." target="changeTarget()">
    <input name="scanID" id="scanID" value="12345678" onFocus="this.value=''" />
    <input name="fromLaunchScreen" id="fromLaunchScreen" type="hidden"/>
    <input type="submit" id="SubmitForEdit" style="display:none;"/>
  </form>
</div>

<div class="outerdiv">
<iframe name="frame1" class="inneriframe"></iframe>
</div>

<div class="outerdiv">
<iframe name="frame2" class="inneriframe"></iframe>
</div>
<div class="outerdiv">
<iframe name="frame3" class="inneriframe"></iframe>
</div>
<div class="outerdiv">
<iframe name="frame4" class="inneriframe"></iframe>
</div>
<div class="outerdiv">
<iframe name="frame5" class="inneriframe"></iframe>
</div>
<div class="outerdiv">
<iframe name="frame6" class="inneriframe"></iframe>
</div>
<div class="outerdiv">
<iframe name="frame7" class="inneriframe"></iframe>
</div>
<div class="outerdiv">
<iframe name="frame8" class="inneriframe"></iframe>
</div>
<div class="outerdiv">
<iframe name="frame9" class="inneriframe"></iframe>
</div>
<div class="outerdiv">
<iframe name="frame10" class="inneriframe"></iframe>
</div>

</div>

• javascript
• iframe
• attributes
• target

• Where's the code? You say it's below, but I don't see it. – Dancrumb Commented Apr 24, 2011 at 21:00
• use the onsubmit event on your form – Ibu Commented Apr 24, 2011 at 21:05

3 Answers 3

How bout changing

<input type="submit" id="SubmitForEdit" style="display:none;"/>

to:

<input type="button" id="SubmitForEdit" onclick="changeformtarget();" style="display:none;"/>

and addding

<script type="text/javascript">
var count = 1;
function changeformtarget() {
     document.getElementById('auditRepairForm').target = 'frame'+count;
     count += 1;
}
</script>

If you use IFRAME and not AJAX, you need to put a small javascript code in the page you submit to, in the iframe.
That code should either directly change the attribute of the form in the parent window, or activate a function in the parent window that does that.

I think you'll need to use a setTimeout because there is otherwise no chance to break out of the submit event:

<script type="text/javacript">
var count = 2;
function submit() {
    setTimeout(function () {
         // this will get executed AFTER the form submits
         document.getElementById("the_form").target = "frame" + count;
         count += 1; // increase the counter so next time is frame3;
    }, 1);
    return true;
}
</script>
<form id="the_form" onsubmit="return submit();" target="frame1">
..etc..
</form>