HTML form with input radio and one text input with the same attribute name

forms, html, javascript

Solution

Try this pure javascript (modified your html code)

function changeradioother() {
  var other = document.getElementById("other");
  other.value = document.getElementById("inputother").value;
}

<input type="radio" name="server" value="1">Production<br>
<input type="radio" name="server" value="2">Test<br>
<input type="radio" name="server" value="3">Localhost<br>
<input type="radio" name="server" id="other" value="other">Other <input id="inputother" type="text" onchange="changeradioother()" />
<input type="submit" value="Submit">

I added an id to the last radio button and the inputbox.

Problem

I am trying to do a radio buttons group with couple of options and the last option will be a text input field "Other". Something like this: I want to do it so when submitted, the url called is app://configuration?server=... server should contain the value of the server attribute wether it's from one of the radio buttons or from the input group I tried to do this ``` <form method="GET" action="app://configuration"> Select server <br> <input type="radio" name="server" value="1">Production<br> <input type="radio" name="server" value="2">Test<br> <input type="radio" name="server" value="3">Localhost<br> <input type="radio" name="server" value="">Other <input type="text" name="server" /> <input type="submit" value="Submit"> </form> ``` I have used the same `name` attribute for the radio buttons and the input field and the result is that the `name` (server) is being duplicated when the submit is pressed. I understand why it doesn't work in the current way. Any idea how to achieve something like this with javascript ? (no third party like jquery please) I have no access to change the server code so I can't use a different attribute name because the server will not know it...

Original source