Radio button onclick insert value to href

Question

Hi,

I’m trying to insert the url from an onlick event in the the radio buttonsto the href link but it not working. Here’s I have so far.

<input type="radio" name="orderID" value="1"  onclick="javascript:document.getElementById('editBTN').href='forms/editForm.cfm?orderID ='&this.value">

<input type="radio" name=" orderID " value="2" onclick="javascript:document.getElementById('editBTN').href='forms/editForm.cfm?orderID ='&this.value">

Etc…

The link below href should change depending on which radio button is clicked.

<a href="" id="editBTN"> Edit Order</a>

The above script returns the current url with “localhost/myApp/0” at the end. If I remove this ('forms/editForm.cfm?orderID='&) from the radio button it correctly return the orderId.

I would like this result localhost/myApp/forms/editForm.cfm?orderID=1. Any suggestion would be greatly appreciated.

Answer 1

I think the & before this.value should be a +

Answer 2

JavaScript uses + to concatenate strings, not &:

onclick="document.getElementById('editBTN').href=
         'forms/editForm.cfm?orderID ='+this.value"

(line break added for readability) should work.

You can lose the javascript: prefix, by the way.

Answer 3

You listed jquery as one of your question tags. I'd simply place the following script onto my page and attach the click event on the radio's to push their value into the appropriate button attribute.

$('input[name=orderID]').click(function(e) {

$('#editBTN').attr('href', 'forms/editForm.cfm?orderID ='+$(this).val());

});