1

I've read variations on this for a few days and can't find a working solution to what I want. And it's probably easier than I'm making out.

I have a set of radio buttons, and want to pass the checked value to part of a URL.

<input type="radio" name="link" value="one" checked="checked">One
<input type="radio" name="link" value="two">Two
<input type="radio" name="link" value="three">Three

And I want the value of whichever one is checked to be passed to a variable such as dt which then passes to the Submit button which takes you to a url that includes text from the radio buttons.

<input type="button" value="OK" id="ok_button" onclick="parent.location='/testfolder/' + dt;>

But I'm struggling to find out how to get var dt = document.getElementByName('link').value; to work for me when I try and apply a for loop to make sure it's checked.

Does my onclick='parent.location.... in the submit button need to be in a function rather than part of the submit button? So the same function can grab the value of the radio button?

So I'm appealing to StackOverflowers for hopefully a bit of guidance... Thanks

action jack
  • 43
  • 1
  • 8
  • What would the URL look like, how does that URL influence the page? – David Thomas Sep 30 '14 at 11:30
  • What do you expect `parent.location` to do..? what is parent..? – T J Sep 30 '14 at 12:02
  • The radio buttons are in a pop up window box, and parent is used for the link to go to the main window rather than in the pop up box. A solution below works great for me. Cheers – action jack Sep 30 '14 at 12:40

4 Answers4

2

First of you want to know which value your combobox has with this easy to use on-liner.

document.querySelector('[name="link"]:checked').value;

I suggest using event handlers to handle the javascript, so don't write it in the onclick attribute.

 var btn = document.getElementById('ok_button');
 btn.addEventListener('click', function(){ /*handle validations here*/ })

jsfiddle

A1rPun
  • 16,287
  • 7
  • 57
  • 90
0

var dt = document.getElementsByName('link')[0].value works for me

you can use it in either the inline onclick handler or a function you define

eno3nt
  • 214
  • 1
  • 4
  • You don't get the actual checked value.. You only get the value of the first radiobutton. [see here](http://jsfiddle.net/snyr38ae/) – A1rPun Sep 30 '14 at 11:50
0

you can try below code

<input type="button" value="OK" id="ok_button" onclick="functionName();'>

JavaScript Code

        <script type="javascript">
function functionName(){
    var radios = document.getElementsByName('link'), 
        value  = '';

    for (var i = radios.length; i--;) {
        if (radios[i].checked) {
            value = radios[i].value;
            break;
        }
    }

             window.location.href='/testfolder/'+ value   
        }
        </script>
prog1011
  • 3,425
  • 3
  • 30
  • 57
  • That's cracked it. Thank you. The hyperlink also pulls in bits of php too, and works fine bringing it into the script. The missing link... many thanks. – action jack Sep 30 '14 at 12:37
  • @user3577774 - glad to help you - If answer is useful, click on 'correct' and give 'upvote' so it will helps other to find out correct solution. – prog1011 Sep 30 '14 at 12:43
  • I tried the UpVote but I don't have enough 'reputation' points yet. When I do.... I will :) Have ticked it though. Thanks again – action jack Sep 30 '14 at 13:35
0
<input type="radio" id="1" name="link" onchange="WhatToDo()" value="one">One</input>
<input type="radio" id="2" name="link" onchange="WhatToDo()" value="two">Two</input>
<input type="radio" id="3" name="link" onchange="WhatToDo()" value="three">Three</input>


<script type="text/javascript">
function WhatToDo() {
   var rButtons = document.getElementsByName('link');
for (var i = 0; i < rButtons.length; i++) {
    if (rButtons[i].checked) { 
        alert(rButtons[i].value);
    }     
  }
}
</script>

Maybe something like this. Use onchange and then loop through your radio buttons. Whilst looping look to see if the radio button is checked. Its a starting point.

mjroodt
  • 3,223
  • 5
  • 22
  • 35
  • Thanks for that. I had trouble passing it into my URL link. However I managed solution based on another reply (below). Thanks for the help. – action jack Sep 30 '14 at 12:42