Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations wOOdy-Soft on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

IF ELSE question 4

Status
Not open for further replies.
Jun 9, 2004
188
US
Hello I really do not know much javascript so I wont beat around the bush. I am trying to change a forms action based on radio buttons that the users selects.

For example:
Radio 1 is selected the action would be search.asp
If radio2 is selected then action would be searchsite.asp

Is this possible with javascript?

Can anyone show me an example that I can tweak.

This is what I have so far:
Code:
<form action="+ need to change this value +" method="post" name="entry" >
	<input type="text" name="search_value" size="26"> <br>
	<input type="radio" name="group1" value="radio1" checked>
    <font size="1" face="Verdana, Arial, Helvetica, sans-serif">Radio 1</font> 
    <input type="radio" name="group1" value="radio2">
    <font size="1" face="Verdana, Arial, Helvetica, sans-serif">Radio2</font> 
    <input type="submit">
</form>
Code:
script language="JavaScript">

  
      if (form == radio1)
       {
         document.writeln("do something");
       }
      else
       {
         document.writeln("do something");
       }  
   ; 
  // end hiding code -->
</script>
i have no clue on what is going on but I thought it might be worth a try.
 
just a thought... why don't you send them to the same page, and handle the differences on that same page?

[conehead]
 
Try:

function setAction()
{
var actions=['search.asp', 'searchsite.asp'];
var radiobuttons=document.forms['entry'].elements['group1'];
for (var ri=0;ri<radiobuttons.length;ri++)
{
if (radiobuttons[ri].checked)
{
document.forms['entry'].action=actions[ri];
break;
}
}
}

<form action="" method="post" name="entry" onsubmit="setAction()">
 
Slight variation of troll's code, utilizing the value of the radiobutton:

Code:
function setAction() {
    var r = document.forms['entry'].elements['group1'];
    for (var i = 0; i < r.length; i++) {
        if (r[i].checked) {
            document.forms['entry'].action = r.value;
            break;
        }
    }
}

<form name="entry">
<input type="radio" name="group1" value="[URL unfurl="true"]http://www.yahoo.com/"[/URL] checked>
<input type="radio" name="group1" value="[URL unfurl="true"]http://www.google.com/">[/URL]
</form>

*cLFlaVA
----------------------------
Lois: "Peter, you're drunk!"
Peter: "I'm not drunk, I'm just exhausted from stayin' up all night drinking!
 
what about this:

function subForm()

if(document.entry.group1.value == "radio1"){
actionPage = "the action page you want it to go";
document.entry.action = actionPage;
document.entry.method = "post";
document.entry.submit();
}else{
actionPage = "the other action page you want it to go";
document.entry.action = actionPage;
document.entry.method = "post";
document.entry.submit();
}

and the beginning of your form would look like this.
<form name = "entry">
stuff
stuff
stuff...etc...
</from>


"Behind every great fortune there lies a great crime", Honore De Balzac
 
Yes, if you put the URL you wanted to switch to as the radio button value, then you would be able to use it like cLFlaVA's code does.
 
yeah, that function would be terribly long with 5 or more radio buttons.

*cLFlaVA
----------------------------
Lois: "Peter, you're drunk!"
Peter: "I'm not drunk, I'm just exhausted from stayin' up all night drinking!
 
Crap, slight change in my code:

Code:
function setAction() {
    var r = document.forms['entry'].elements['group1'];
    for (var i = 0; i < r.length; i++) {
        if (r[i].checked) {
            document.forms['entry'].action = r[i].value;
            break;
        }
    }
}

<form name="entry">
<input type="radio" name="group1" value="[URL unfurl="true"]http://www.yahoo.com/"[/URL] checked>
<input type="radio" name="group1" value="[URL unfurl="true"]http://www.google.com/">[/URL]
</form>

*cLFlaVA
----------------------------
Lois: "Peter, you're drunk!"
Peter: "I'm not drunk, I'm just exhausted from stayin' up all night drinking!
 
Thanks guys very quick response and I do appriciate it. I will tested them all out and also try to understand what is going on.
 
Wow, stars all around. We need more people like you :)

Thanks.

*cLFlaVA
----------------------------
Lois: "Peter, you're drunk!"
Peter: "I'm not drunk, I'm just exhausted from stayin' up all night drinking!
 
I spoke to soon. I used bnywy code because it seeemed suitable for what I was doing: However it keeps defualt to the google check radio even if I select the other. See below. Any ideas. I tried it without document.

Code:
<script language="javaScript" type="text/javascript">

function subForm(){

if(entry.group1.value == "it"){
    actionPage = "search.php";
    document.entry.action = actionPage;
    document.entry.method = "post";
    document.entry.submit();
}
if(document.entry.group1.value == "intranet"){
    actionPage = "search.php";
    document.entry.action = actionPage;
    document.entry.method = "post";
    document.entry.submit();
}
else{
    actionPage = "[URL unfurl="true"]http://www.google.com/search";[/URL]
    document.entry.action = actionPage;
    document.entry.method = "get";
    document.entry.submit();
	}
}
</script>

</head>

<form name="entry" onsubmit="subForm()">

<input type="text" name="q" size="26" value=""> 

<input type="radio" name="group1" value="it" checked>IT     <input type="radio" name="group1" value="intranet">Inranet 
<input type="radio" name="group1" value="google">Google    

<input type="submit" value="search">

</form>
 
Values exist for radiobuttons REGARDLESS of whether or not they are checked.

You should be checking for .checked, not .value == 'blah'

*cLFlaVA
----------------------------
Lois: "Peter, you're drunk!"
Peter: "I'm not drunk, I'm just exhausted from stayin' up all night drinking!
 
I didnt know that. I thought when they are checked the value is passed.Let me test.
 
try this:

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

function subForm(){

if(document.entry.group1[0].checked){
actionPage = "search.php";
document.entry.action = actionPage;
document.entry.method = "post";
document.entry.submit();
}
else if(document.entry.group1[1].checked){
actionPage = "search.php";
document.entry.action = actionPage;
document.entry.method = "post";
document.entry.submit();

}
else{
actionPage = " document.entry.action = actionPage;
document.entry.method = "get";
document.entry.submit();
}
}
</script>

</head>

<body>
<form name="entry" onsubmit="subForm()">

<input type="text" name="q" size="26" value="">

<input type="radio" name="group1" value="it" checked>IT <input type="radio"

name="group1" value="intranet">Inranet
<input type="radio" name="group1" value="google">Google

<input type="submit" value="search">

</form>
</body>
</html>

"Behind every great fortune there lies a great crime", Honore De Balzac
 
bnymk-

Is there any reason you're calling the submit() method from the onsubmit event?

*cLFlaVA
----------------------------
Lois: "Peter, you're drunk!"
Peter: "I'm not drunk, I'm just exhausted from stayin' up all night drinking!
 
Am not totally clear what your question is but I'm not calling the submit() method from the onSubmit() but rather calling a funtion called subForm(). Inside this function, I call the submit() method to submit the form depending on what has been selected from the radio button.

"Behind every great fortune there lies a great crime", Honore De Balzac
 
No, using the onSubmit event means you ARE going circular in submitting the form. When you submit the form, it calls subForm(), which submits the form, which calls subForm(), which submits the form, etc.
 
ah.....now I see what you guys are talking about. Sorry for the confusion. There is no need at all. I didn't even notice it until much later (must be going blind I guess). I just copied Sundance's code and only worked on the Javascript side and pasted it back as a solution. Nice catch though.

"Behind every great fortune there lies a great crime", Honore De Balzac
 
Hey guys.I am back. I hate to start an argument between you all. Anyways, I added a validation to the code and it seems to be working when someone has a blank entry or less then 3 characters. The alert comes up then opens another window with the form.

Is there an exit command?

I tried return false, but it does not seem to exit.

Code is below:

Code:
<script language="javaScript" type="text/javascript">

function subForm(){

if (document.entry.q.value.length < 3) {
     alert("You search is either blank, invalid, or too short. Please try again");
      return false;
	
 }

else if(document.entry.group1[0].checked){
    actionPage = "search.php";
    document.entry.action = actionPage;
    document.entry.method = "post";
    
}
else if(document.entry.group1[1].checked){
    actionPage = "search.php";
    document.entry.action = actionPage;
    document.entry.method = "post";

 
}
else{
    actionPage = "[URL unfurl="true"]http://www.google.com/search";[/URL]
    document.entry.action = actionPage;
    document.entry.method = "get";

    }
	 
}
</script>


the form:

 <form name="entry" onsubmit="subForm();" target="_blank">

blah blah the rest
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top