PDA

Click to See Complete Forum and Search --> : Form Submission

mili
05-29-2003, 06:56 PM
Hello!

I have a page that contains 4 navigation tabs.Each tab loads a form into an iframe.So there are 4 individual html pages.
My questions are:
1. how can I perform a single submit for all these pages.
2. Also, When I tab thro' these tabs, I dont want to lose the values that have already been entered.
Here is how my page looks like:

<html>
<head>
<title> </title>
<script language="JavaScript" type="text/javascript">
<!--//
leftOn = "../images/tab_left_on.gif";
rightOn = "../images/tab_right_on.gif";
leftOff = "../images/tab_left_off.gif";
rightOff = "../images/tab_right_off.gif";
colorOn = "#333366";
colorOff = "#5389BC";
//
function selectTab(tab,cnt) {
for (var j=1; j<=cnt; j++) {
if (j==tab) {
document.images["LTab"+j].src = leftOn;
document.getElementById("Tab"+j).bgColor = colorOn;
document.images["RTab"+j].src = rightOn;
} else {
document.images["LTab"+j].src = leftOff;
document.getElementById("Tab"+j).bgColor = colorOff;
document.images["RTab"+j].src = rightOff;

}
}
return true;
}
//-->
</script>
</head>

<body leftmargin="0" topmargin="0" >

<br>

<table width="600" align="center">
<tr>
<td>Enter Definitions for each Tab :</td>
</tr>
</table>
<br>

<table border="0" cellpadding="0" align="center" cellspacing="0" width="600">
<tr valign="top">
<td width="8" bgcolor="#333366"><img name="LTab1" src="../images/tab_left_on.gif" width="8" height="19" alt="" border="0"></td>
<td id="Tab1" width="137" valign="middle" bgcolor="#333366" align="center"><a onclick="return selectTab(1,4);" href="header_top.html" target="content" class="tablink"><font color="white">&raquo;</font>&nbsp;Form 1</a></td>
<td width="8" bgcolor="#333366"><img name="RTab1" src="../images/tab_right_on.gif" width="8" height="19" alt="" border="0"></td>
<td width="1"><img src="spacer_trans.gif" width="1" height="1" alt="" class="decoration"></td>
<td width="8" bgcolor="#5389BC"><img name="LTab2" src="../images/tab_left_off.gif" width="8" height="19" alt="" border="0"></td>
<td id="Tab2" width="137" valign="middle" bgcolor="#5389BC" align="center" ><font color="white">&raquo;</font>&nbsp;<a onclick="return selectTab(2,4);" href="body_top.html" target="content" class="tablink">Form 2</a></td>
<td width="8" bgcolor="#5389BC"><img name="RTab2" src="../images/tab_right_off.gif" width="8" height="19" alt="" border="0"></td>
<td width="1"><img src="spacer_trans.gif" width="1" height="1" alt="" class="decoration"></td>
<td width="8" bgcolor="#5389BC"><img name="LTab3" src="../images/tab_left_off.gif" width="8" height="19" alt="" border="0"></td>
<td id="Tab3" width="135" valign="middle" bgcolor="#5389BC" align="center" ><font color="white">&raquo;</font>&nbsp;<a onclick="return selectTab(3,4);" href="footer_top.html" target="content" class="tablink">Form 3</a></td>
<td width="8" bgcolor="#5389BC"><img name="RTab3" src="../images/tab_right_off.gif" width="8" height="19" alt="" border="0"></td>
<td width="1"><img src="spacer_trans.gif" width="1" height="1" alt="" class="decoration"></td>
<td width="8" bgcolor="#5389BC"><img name="LTab4" src="../images/tab_left_off.gif" width="8" height="19" alt="" border="0"></td>
<td id="Tab4" width="137" valign="middle" bgcolor="#5389BC" align="center" ><font color="white">&raquo;</font>&nbsp;<a onclick="return selectTab(4,4);" href="validation_top.html" target="content" class="tablink">Form 4</a></td>
<td width="8" bgcolor="#5389BC"><img name="RTab4" src="../images/tab_right_off.gif" width="8" height="19" alt="" border="0"></td>

</tr>
<tr><td colspan="16" bgcolor="#333366"><img src="spacer_trans.gif" width="1" height="1"></td></tr>
</table>

<IFRAME name="content" scrolling="auto" frameborder="0" framespacing="0" border="0" width="625" src="form1.html" height="350" align="center">
</IFRAME>

<table align="center">
<tr>
<td align="right"><input type="submit" value="submit" > </td>
</tr>
</table>

</body>
</html>

(Credit goes to Dave for helping me build these tabs)
Thanks!
mili
05-29-2003, 07:34 PM
Thanks dave!

I think I like your second idea.

Ok, correct me if I'm wrong-this is what I understand:

After entering form 1, I click the tab for form 2.Now, I store the values of form 1 in input hidden fields, right? I'm not just restricted to click form 2, I can also go to form 3 or form 4 and I should be able to store these values in input hidden fields, right?

BTW, I noticed something..my title used to be "member" and now I see it has changed to "webmaster".I dont think I deserve this yet :)
mili
06-02-2003, 06:47 PM
Alright, I dont think I'm able to solve this problem.I would appreciate any help!

I tried this instead

combined all 4 html pages into one HTML page. Each section of code goes inside a separate DIV and have the 4 DIVs inside 1 form. Added code to display or hide the DIVs when you change tab . I hate doing this because my individual pages are very large and I dont like to put them all into one page.

Please help me!

Thanks in advance
mili
06-02-2003, 09:27 PM
Dave,

Thanks! I have it at work. I will be able to provide you with a link tomorrow.Thanks again!
mili
06-03-2003, 10:01 AM
Dave, I has trouble uploading files to my website.I thought it was quicker to provide you with a zip file instead.
Here you go :
Thanks
mili
06-03-2003, 10:05 PM
Here you go :)

http://mili.home.att.net/html/main.html

These are plain html files.

Thanks!