autopopulate another form once submit

Hello!

I have what I think is semi-easy. I just can't figure it out.

<html>
<body>
<div id="container">

//scan in barcode here
		<div id="repairID">
			<table>
			   <tr>
			      <td>
			      Scan ID: 
			      </td>
                              <td>
			<form method="post" name="editRepairForm" action="https://example.com/IDEdit.do" target="frame1">
		    	<input name="scanId" id="scanId" value="" />
		    	<input name="fromLaunchScreen" id="fromLaunchScreen" type="hidden"/>
		    	<input type="submit" id="SubmitForEdit" style="display:none;"/>
			</form>
			      </td>
			   </tr>
			</table>
		</div>

//First row of results
<div id="outerdiv">
<iframe name="frame1" id="inneriframe"></iframe>
</div>

</body>
</html>

Okay so here is what I'm looking for. I'll be scanning a barcode into the top div. Then the result will be displayed in the iframe named "frame1".

Here the issue: I need for the next time I scan a barcode for the site to auto populate another DIV with "frame2" in it, then show the results in there. Then.. the next scan auto-populate another div with "frame3" in it and the results show there.. and so on.

There must be an easy way to do that.. right? I'm sorta new to Javascript so go easy on me! :)

Thanks in advance

devinodaniel

Light Poster

47 posts since Feb 2011

Reputation Points: 10

Solved Threads: 0

1 Year Ago

Maybe this could help. What I'm really looking for here first is how can I make the target of the form change after I submit once.

For instance.. when page first loads it would be 'frame1'. After submitting, the NEXT time I submit it targets 'frame2', then 'frame3' in numerical succession for indefinite amounts.

Help at all?

:/ I've tried getting the GetFormElementByID.target but I don't really know what to do with it next. lol

devinodaniel

Light Poster

47 posts since Feb 2011

Reputation Points: 10

Solved Threads: 0

1 Year Ago

on submit you can go on appending content to outerdiv by keeping currentframeno variable. everytime user submit, increment your currentframeno by one and append

document.getElementById("outerdiv").innerHTML=document.getElementById("outerdiv").innerHTML+"<iframe name='frame"+currentframeno+"' id='frame"+currentframeno+"'>your content</iframe>"

urtrivedi

Nearly a Posting Virtuoso

1,306 posts since Dec 2008

Reputation Points: 257

Solved Threads: 270

1 Year Ago

I think you need ajax.Reason is below.
let you have a result in frame-1.
Once you submit form page is refreshed.
So even your next target is frame2, your frame1 data will be cleared because of second form submit.

vibhaJ

Posting Shark

931 posts since Apr 2010

Reputation Points: 161

Solved Threads: 183

1 Year Ago

on submit you can go on appending content to outerdiv by keeping currentframeno variable. everytime user submit, increment your currentframeno by one and append
document.getElementById("outerdiv").innerHTML=document.getElementById("outerdiv").innerHTML+"<iframe name='frame"+currentframeno+"' id='frame"+currentframeno+"'>your content</iframe>"

Thank for your help! I think we're on the right track with this. I've got another example that may be more clear. I'm looking to change the target of the form, not change the iframe name or id. Something like this:

Each time an object is scanned, the results show up inside the next iframe.. so it creates kind of a list.

<!DOCTYPE html>
<head>
</head>
<body>
<div id="container">
<div id="scanID">
		
		
			     <form method="post" id="auditRepairForm" name="auditRepairForm" action="https://example.com.com" 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>

</body>
</html>

devinodaniel

Light Poster

47 posts since Feb 2011

Reputation Points: 10

Solved Threads: 0

1 Year Ago

I had a friend help me from another site and he came up with this. It seems close but still on submit only submits to frame 1 every time.

<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>

devinodaniel

Light Poster

47 posts since Feb 2011

Reputation Points: 10

Solved Threads: 0

1 Year Ago

I'm beginning to think this is impossible and no one knows how to do it! I'm getting to the point I would pay someone to help me.

Anyone?!?

devinodaniel

Light Poster

47 posts since Feb 2011

Reputation Points: 10

Solved Threads: 0

1 Year Ago

its good that you used count variable not you must keep it as hidden in the form

here is html form code

<INPUT TYPE=HIDDEN id=currentframeno name=currentframeno value=<?php echo ($_POST['currentframeno'])+1 ?>>

then initialise it in javascript as

count = <?php echo $_POST['currentframeno']?>;

urtrivedi

Nearly a Posting Virtuoso

1,306 posts since Dec 2008

Reputation Points: 257

Solved Threads: 270

1 Year Ago

I can't for the life of me get it to work that way. lol thank you everyone for your help. I'm trying a different technique as my last and final attempt. Using this code a new div is populated with every submit but I can't figure out how to get a new iframe with a unique name on it to populate and change the target of the form to match that.

I've also attached a working site so that it's easier to visualize what I'm struggling with. I've removed the actual urls in form action because it's on a secure access site only available from within an internal network.

http://spectacledesigns.com/test/

thank you again for your opinions and time!

<script type="text/javascript" language="javascript">

    function createDiv()
    {
        var divTag = document.createElement("div");
        
        divTag.setAttribute("align","center");
      
        divTag.style.margin = "0px auto";
     
        divTag.className ="outerDiv";
        
        divTag.innerHTML = "<iframe id=iframe name=frame1 class=inneriframe>This HTML Div tag created using Javascript DOM dynamically.</iframe>";
        
        document.body.appendChild(divTag);
}
</script>

devinodaniel

Light Poster

47 posts since Feb 2011

Reputation Points: 10

Solved Threads: 0

This article has been dead for over three months

You