Link to home
Start Free TrialLog in
Avatar of cukcuk
cukcuk

asked on

Submit 2 different form with 1 button

Hi,
How can i submit 2 different form with different name and different post action just by using a submit button?
I have tried the function e.g.:

document.form1.submit();
document.form2.submit();

but it only process the form2.
Is it possible not to use any hidden forms and frameset?
Any ideas?
Avatar of sybe
sybe

if form1 has a different target, then it should work...
Avatar of cukcuk

ASKER

form1 does have different post action than form2.
e.g.:

--------------

<script language="javascript">
function submitall(){
document.form1.submit();
document.form2.submit();
}
</script>

<form name="form1" action="1.asp">
<input type......>
</form>

<form name="form2" action="2.asp">
<input type......>
</form>

<form name="all" onSubmit="submitall()">
<input type="submit" name="submit" value="SUBMIT">
</form>

--------------

does this works?
Try using two hidden buttons named (for example) b1 and b2, the b1 to submit the first form and b2 for the second; then use a visible button with a click() function:
<form name="form1" action="1.asp">
<input type......>
<input type="submit" name="submit1" value="" style=";position:absolute;visibility:hidden">
</form>

<form name="form2" action="2.asp">
<input type......>
<input type="submit" name="submit2" value="" style=";position:absolute;visibility:hidden">
</form>

<form name="a">
<input type="button" name="b" value="SUBMIT BOTH" onClick="document.form1.submit1.click(); document.form2.submit2.click()">
</form>
That only for MSIE
jbosch(vosk)
Avatar of cukcuk

ASKER

vosk: I'll try that in a while. What about Netscape?
Avatar of cukcuk

ASKER

vosk: I can't get both of the submit1 & submit2 work at the same time. I just swapped the onClick javascript, this is quite stupid...

----- case 1 -----
<form name="form1" action="1.asp">
1: <input type="text" name="1" size="20">
<input type="submit" name="submit1" value="" style="position:absolute;visibility:hidden;">
</form>
<BR>
<form name="form2" action="2.asp">
2: <input type="text" name="2" size="20">
<input type="submit" name="submit2" value="" style="position:absolute;visibility:hidden;">
</form>
<BR>
<form name="all">
<input type="button" name="submit" value="SUBMIT" onClick="document.form2.submit2.click();document.form1.submit1.click();">
</form>
----- form1 runs only -----

----- case 2 -----
<form name="form1" action="1.asp">
1: <input type="text" name="1" size="20">
<input type="submit" name="submit1" value="" style="position:absolute;visibility:hidden;">
</form>
<BR>
<form name="form2" action="2.asp">
2: <input type="text" name="2" size="20">
<input type="submit" name="submit2" value="" style="position:absolute;visibility:hidden;">
</form>
<BR>
<form name="all">
<input type="button" name="submit" value="SUBMIT" onClick="document.form1.submit1.click();"> document.form2.submit2.click();
</form>
----- form2 runs only -----
For MSIE that is a sample code about what I mean (that is not your form, is only a sample about how works the onClick):
<html>
<head>
</head>
<body>
<form name="a">
<input type="text" name="b" value="">
<input type="button" name="c" value="" onClick="document.a.b.value = 'button 1 pressed'">
</form>
<form name="d">
<input type="text" name="e" value="">
<input type="button" name="f" value="" onClick="document.d.e.value = 'button 2 pressed'">
</form>
<form name="g">
<input type="button" name="h" value="SEND BOTH" onClick="document.a.c.click(); document.d.f.click();">
</form>
</body>
</html>
Just set the real submit buttons hidden (and absolute positioned to not use space on the page).
But I'm thinking that maybe two post actions cannot be run at the same time.
jbosch(vosk)
I cannot see where is the problem; I have tryed using two mail forms to mail myself and it works well: first is posted the first form and then the second.
Althought if you don't want to use that, you can try making a script to delay the second action. Or maybe you can modify your asp to return a value when receives the first form; but onSubmit you have to start a loop that waits for the value returned for the asp (just use a hidden field); then, when receives the value stop the loop and send the next form.
When you say "at the same time" you mean that the forms cannot be sended one before the other? The post of both forms have to be exactly?
jbosch(vosk)
Avatar of cukcuk

ASKER

It doesn't matter which form submit first, as long as both of them are submitted successfully.
Dont be stupid.

What is happening is that:

"document.form1.submit();"

is executed, then before the new page has even loaded, (or infomation been sent)

this code runs:

"document.form2.submit();"

the only sollutions are:

combining all info into one form.

-OR-

having a hidden frame.

form 1 will target that hidden frame

form 2 will not have a target specified, defaulting to self. the page you see will be the resultant for page 2. The result from form 1's submission will be hidden.

[ - i wouldnt recommend this
if you need the content from both forms before displaying a response, set the first one subitting then set a 5 second timeout on the second.
-]
Avatar of cukcuk

ASKER

reubenbell: I tried the following targeting code but failed. Not sure about the correct format tough.

---

<FRAMESET COLS="0,0,*" BORDER=0>
  <FRAME SRC="1.asp" NAME="one">
  <FRAME SRC="2.asp" NAME="two">
  <FRAME SRC="index.asp" NAME="main">
</FRAMESET>

--- index.asp

<script language="javascript">
function submitall(){
document.form1.submit();
document.form2.submit();
}
</script>

<form name="form1" target="one" action="1.asp">
1: <input type="text" name="1" size="20">
</form>
<BR>
<form name="form2" target="two" action="2.asp">
2: <input type="text" name="2" size="20">
</form>
<BR>
<form name="all" onSubmit="submitall();">
<input type="submit" name="submit" value="SUBMIT">
</form>
Note... you dont actually need a frameset definition to put a target in a form. If the target window doesn't exist it will just create a new window and throw the results there.

Have you tried submitting the second form from the first forms onSubmit handler?

<form1 .... onSubmit="document.form2.submit()">
<input type="submit">
</form>
<form2 .... target="foo">
<input type="image" SRC="invisibile.gif">
</form>

Basic Question : What browser(s) are you developing for/under? Some older browsers required a submit or image element in the form for the submit() method to work properly.

Just some thoughts
Avatar of cukcuk

ASKER

reubenbell: I tried the following targeting code but failed. Not sure about the correct format tough.

---

<FRAMESET COLS="0,0,*" BORDER=0>
  <FRAME SRC="1.asp" NAME="one">
  <FRAME SRC="2.asp" NAME="two">
  <FRAME SRC="index.asp" NAME="main">
</FRAMESET>

--- index.asp

<script language="javascript">
function submitall(){
document.form1.submit();
document.form2.submit();
}
</script>

<form name="form1" target="one" action="1.asp">
1: <input type="text" name="1" size="20">
</form>
<BR>
<form name="form2" target="two" action="2.asp">
2: <input type="text" name="2" size="20">
</form>
<BR>
<form name="all" onSubmit="submitall();">
<input type="submit" name="submit" value="SUBMIT">
</form>
Avatar of cukcuk

ASKER

reubenbell: I tried the following targeting code but failed. Not sure about the correct format tough.

---

<FRAMESET COLS="0,0,*" BORDER=0>
  <FRAME SRC="1.asp" NAME="one">
  <FRAME SRC="2.asp" NAME="two">
  <FRAME SRC="index.asp" NAME="main">
</FRAMESET>

--- index.asp

<script language="javascript">
function submitall(){
document.form1.submit();
document.form2.submit();
}
</script>

<form name="form1" target="one" action="1.asp">
1: <input type="text" name="1" size="20">
</form>
<BR>
<form name="form2" target="two" action="2.asp">
2: <input type="text" name="2" size="20">
</form>
<BR>
<form name="all" onSubmit="submitall();">
<input type="submit" name="submit" value="SUBMIT">
</form>
Avatar of cukcuk

ASKER

Sorry... i reloaded the answer and caused duplication.
I'm mainly developing for IE, but Netscape is a minority.
I'll try the method as you suggested.
thats good, except we dont 'need' to have a third form now do we?!

lets try using:

<a href="#" onclick="submitall();return false;">Submit All</a>
(or input type="button" etc)





-OR-



- framset.html

<FRAMESET COLS="0,*" BORDER=0>
 <FRAME SRC="blank.html" NAME="one">
 <FRAME SRC="index.asp" NAME="main">
</FRAMESET>

- index.asp

<script language="javascript">
function submitall(){
document.form1.submit();
return true; //will now submit 2nd
}
</script>

<form name="form1" target="one" action="1.asp">
1: <input type="text" name="1" size="20">
</form>
<BR>
<!-- we will go to the page specified in the action for this form -->
<form name="form2" action="2.asp" onsubmit="return submitall();">
2: <input type="text" name="2" size="20">
</form>
ASKER CERTIFIED SOLUTION
Avatar of reubenbell
reubenbell

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial