By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
459,466 Members | 1,164 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 459,466 IT Pros & Developers. It's quick & easy.

Javascript -- go to URL based on radion button sets selection

P: 2
Hello, I'd trying to write a script that would on clicking submit go to various URLs based on selected radio buttons. I have three sets of radio buttons, and depending on the combination (one button from every set), there will be a different .html page to go on submit.
Is it possible?
I an new to javascript and appreciate any help/directions!
Attached Images
File Type: jpg javascript.jpg (15.9 KB, 339 views)
Jul 24 '11 #1
Share this Question
Share on Google+
3 Replies

Expert Mod 5K+
P: 8,639
nope, wonít work this way.

if you submit a form, it will always go to the URL given in the formís action attribute (which is exactly one). after that, you have left the page and JS cannot work on that same page.

However, if you use AJAX, you can send form data to as many URLs as you want, since you donít leave the page. the "downside" is that you have to collect and pass the data to send yourself.
Jul 24 '11 #2

P: 2
Thanks for your answer. I was hoping to use something similar to this script:

Expand|Select|Wrap|Line Numbers
  1. function checkInput(){
  2.     var val = document.getElementById('myText').value;
  3.     var myForm = document.getElementById('myForm');
  4.     if(val=="valueX")
  5.     myForm.action="page1.html";
  6.             else
  7.                     myForm.action="page2.html";
  8.             }
But I'd need to validate all the radio buttons first and based on the values select the appropriate html page. That's where I get stuck.
Jul 24 '11 #3

Expert Mod 5K+
P: 8,639
if you want to change the action URL based on a selection, thatís something different.

Iím not sure how the 3 different lists come into play, but for a single list that would be easy. all you need is make a radio button change the action URL when being clicked.
Expand|Select|Wrap|Line Numbers
  1. // not taking the page layout into account
  2. <form action="">
  3.   <input type="radio" name="targeturl" value="page1.html" id="url1">
  4.   <label for="url1">Choice 1</label>
  6.   <input type="radio" name="targeturl" value="page2.html" id="url2">
  7.   <label for="url2">Choice 2</label>
  9.   <input type="radio" name="targeturl" value="page3.html" id="url3">
  10.   <label for="url3">Choice 3</label>
  12.   <input type="radio" name="targeturl" value="page4.html" id="url4">
  13.   <label for="url4">Choice 4</label>
  14. </form>
Expand|Select|Wrap|Line Numbers
  1. // the event handler
  2. function changeAction()
  3. {
  4.     this.form.action = this.value;
  5. }
  7. // assign the handlers
  8. var i, radio = document.getElementsByName("targeturl");
  9. for (i = radio.length; i--;) {
  10.     radio[i].onclick = changeAction;
  11. }
Jul 24 '11 #4

Post your reply

Sign in to post your reply or Sign up for a free account.