• 0

Multiple actions per HTML form?

Asked by jackwanders,

 Share

Question

Grand Master

jackwanders

Posted
Posted

Is it possible to make an HTML form that has a different action, depending on the button clicked? I have a form w/ two buttons, and each button will do extremely different things. The way I have it layed out on the page really doesn't allow for me to break it up into two forms, though.

So...any way to do this?

Link to comment
Share on other sites

7 answers to this question

Recommended Posts

  • 0
Contributor

[pioneer]

Posted
Posted

If you want to achieve that, then another programming/scripting language must be learnt.

I use php and I like it, I think it?s easy to use too.

Link to comment
Share on other sites
  • 0
Proficient

draelas

Posted
Posted

ya with php you could have the action run a script that said

if this button is clicked do this

or if this other one is clicked do this other thing

Link to comment
Share on other sites
  • 0
Collaborator

Dragon75

Posted
Posted (edited)

No you can do with with just a little Client side JavaSript.

First make your first form and button.

Then make a second form with all of the inputs hidden. and put the second button in the form.

If the first form is clicked go as normal.

If the second button is click go to a JS function and copy the data from form one to from two. THis way all the data is now in for two then submit.

It will look something like this

<html>

<head>

<title>Untitled</title>

<script language="JavaScript">

function Copydata(){

document.form2.input1.value = document.form1.input1.value;

document.form2.submit();

}

</script>

</head>

<body>

<FORM METHOD="POST" id=form1 name=form1 action="">

<input type="text" name="input1">

<input type="submit" name="Submit1">

</FORM>

<FORM METHOD="POST" id=form2 name=form2 action="">

<input type="hidden" name="input1">

<input type="button" name="Submit2" value="Submit" onclick="Copydata()">

</FORM>

</body>

</html>

All you need is html and client side Javascript and you are done. Nothing more is need :)

Edited by Dragon75
Link to comment
Share on other sites
  • 0
Grand Master

jackwanders

Posted
  • Author
Posted

Good work, Dragon. Couldn't I do it this way, though:

<html>

<head>

<title>Untitled</title>

<script language="JavaScript">

function Copydata(){

document.form2.input1.value = document.form1.input1.value;

}

</script>

</head>

<body>

<FORM METHOD="POST" id=form1 name=form1 action="firstaction.php">

<input type="text" name="input1">

<input type="submit" name="Submit1">

</FORM>

<FORM METHOD="POST" id=form2 name=form2 action="secondaction.php">

<input type="hidden" name="input1">

<input type="button" name="Submit2" value="Submit" onclick="Copydata()">

</FORM>

</body>

</html>

Link to comment
Share on other sites
  • 0
Collaborator

Dragon75

Posted
Posted

Thanks I have done this a few times before.

:)

You need a way to submit the second form. If you look closly it is a button and not a submit so you will need the submit as the end of your function.

Link to comment
Share on other sites
This topic is now closed to further replies.
 Share
Go to question listing

  • Recently Browsing   0 members

    • No registered users viewing this page.