Radio buttons conditional submit

**Joakim Braun** · Jul 23 '05, 04:00 PM

Re: Radio buttons conditional submit

"Sjon" <reynoud@gmail. com> skrev i meddelandet
news:41c02827.0 412140051.6689f d03@posting.goo gle.com...[color=blue]
> Here's A piece of my code:
>
> <form action="dimensi ons.php" method="POST">
> <br><input type="radio" style="backgrou nd : #84c7e8" name="categorie "
> value="Customer " checked> Customer</br>
> <br><input type="radio" style="backgrou nd : #84c7e8" name="categorie "
> value="Employee "> Project Manager</br>
> <br><input type="radio" style="backgrou nd : #84c7e8" name="categorie "
> value="Vendor" > Vendor</br>
> <br><input type="submit" name="submitkno p" value="Change"> </br>
>
> What I want here is that when I click on the submit button, the 'form
> action' target should be changed to an other webpage depending on the
> radio button that has been selected. So, if I selected 'Customer',
> another page should be opened than when I select 'Vendor'. I spent a
> whole day on it (also trying JS etc.) and can't get it to work.
> Anyone to help me?[/color]

1. Give the form a name attribute to be able to reference it:
<form name="myform" action="dimensi ons.php" method="POST">

2. Add an onsubmit handler:

// In the form tag:
<form name="myform" action="dimensi ons.php" method="POST" onsubmit="retur n
submitForm();">

// in the <head>:
<script type=text/javascript">
function submitForm(){

var theForm = document.forms["myform"];
if(theForm){
if(theForm.cate gorie[0].checked){
theForm.action= "blah1.htm" ;
}
else if(theForm.cate gorie[1].checked){
theForm.action= "blah2.htm" ;
}
else if(theForm.cate gorie[2].checked){
theForm.action= "blah3.htm" ;
}
}

return true;
}
</script>

Untested, but you can see how it's supposed to work. (You do have a closing
</form> tag, right?)

Joakim Braun

**Joakim Braun** · Jul 23 '05, 04:00 PM

Re: Radio buttons conditional submit

> "Sjon" <reynoud@gmail. com> skrev i meddelandet[color=blue]
> news:41c02827.0 412140051.6689f d03@posting.goo gle.com...[color=green]
> > Here's A piece of my code:
> >
> > <form action="dimensi ons.php" method="POST">
> > <br><input type="radio" style="backgrou nd : #84c7e8" name="categorie "
> > value="Customer " checked> Customer</br>[/color][/color]
<snip>

By the way, there's no such thing as a closing </br>.

Joakim Braun

**Michael Winter** · Jul 23 '05, 04:00 PM

Re: Radio buttons conditional submit

On Tue, 14 Dec 2004 10:15:56 +0100, Joakim Braun
<joakim.braun@j fbraun.removeth is.com> wrote:
[color=blue]
> "Sjon" <reynoud@gmail. com> skrev i meddelandet
> news:41c02827.0 412140051.6689f d03@posting.goo gle.com...[/color]

[snip]
[color=blue][color=green]
>> <br><input type="radio" style="backgrou nd : #84c7e8"
>> name="categorie " value="Customer " checked> Customer</br>[/color][/color]

These BR elements (and as Joakim said, BR doesn't have a closing tag - in
fact, it's forbidden) should be LABELs. If you styled them as

label {
display: block;
}

you should end up with the same layout, only now it's using appropriate
mark-up.

[snip]
[color=blue][color=green]
>> What I want here is that when I click on the submit button, the 'form
>> action' target should be changed to an other webpage depending on the
>> radio button that has been selected. [...]
>> Anyone to help me?[/color][/color]

This is really something that should be performed server-side, but I
assume from the content that this isn't for the Web anyway.
[color=blue]
> 1. Give the form a name attribute to be able to reference it:
> <form name="myform" action="dimensi ons.php" method="POST">[/color]

Why? There's no need to and if anything, it should be an id, not a name.
If you're trying to support NN4, add both.
[color=blue]
> 2. Add an onsubmit handler:
>
> // In the form tag:
> <form name="myform" action="dimensi ons.php" method="POST"
> onsubmit="retur n submitForm();">
>
> // in the <head>:
> <script type=text/javascript">
> function submitForm(){
> var theForm = document.forms["myform"];
> if(theForm){
> if(theForm.cate gorie[0].checked){
> theForm.action= "blah1.htm" ;
> }
> else if(theForm.cate gorie[1].checked){
> theForm.action= "blah2.htm" ;
> }
> else if(theForm.cate gorie[2].checked){
> theForm.action= "blah3.htm" ;
> }
> }
> return true;
> }[/color]

Or better:

function submitForm(form ) {var categorie = form.elements.c ategorie;
if(categorie[0].checked) {
form.action = 'blah1.html';
} else if(categorie[1].checked) {
form.action = 'blah2.html';
} else if(categorie[1].checked) {
form.action = 'blah3.html';
} else {
alert('Please select a category.');
return false;
}
}

<form action="dimensi ons.php" method="post"
onsubmit="retur n submitForm(this );">

[snip]

Mike

--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail.

**Thomas 'PointedEars' Lahn** · Jul 23 '05, 04:53 PM

Re: Radio buttons conditional submit

<OT>

Joakim Braun wrote:
[color=blue][color=green]
>> "Sjon" <reynoud@gmail. com> skrev i meddelandet
>> news:41c02827.0 412140051.6689f d03@posting.goo gle.com...[color=darkred]
>> > Here's A piece of my code:
>> >
>> > <form action="dimensi ons.php" method="POST">
>> > <br><input type="radio" style="backgrou nd : #84c7e8" name="categorie "
>> > value="Customer " checked> Customer</br>[/color][/color]
> <snip>
>
> By the way, there's no such thing as a closing </br>.[/color]

By the way, there is in XHTML; however the `br' element's content model
is empty (<br/> or <br></br>).

</OT>

PointedEars
--
In theory, practice and theory are the same, but in practice they are
different -- Larry McVoy

Radio buttons conditional submit

Radio buttons conditional submit

Comment

Comment

Comment

Comment