Databases
StackOverflow2013
Postsdbo
POPopulate text field when select radio button
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POPopulate text field when select radio button
    text
    copied!<p>I have an HTML form where I am trying to get a text field to display certain text when I select one of the radio buttons. So far, I have it to where if I click the button it will display the proper text in the text field. My goal is to eliminate the "Click" button and have the text field display the text immediately when I select a radio button. How can I do this in Javascript? </p> <p>I know that textfields have an 'OnKeyUp' event, but I can't seem to figure out if a radio button has some sort of similar thing that would allow me to determine when one is selected. I've tried OnChange and OnFocus events, but maybe I'm doing it wrong because I can't get those to work. Any and all suggestions are much appreciated.</p> <p>This is what I have so far:</p> <pre><code>&lt;HTML&gt; &lt;HEAD&gt; &lt;TITLE&gt;Test Input&lt;/TITLE&gt; &lt;SCRIPT LANGUAGE="JavaScript"&gt; function testResults (form) { var TestVar1 = form.input[0].checked; var TestVar2 = form.input[1].checked; if (TestVar1 == true) { form.textbox.value = "red"; } else if (TestVar2 == true){ form.textbox.value = "blue"; } else if (TestVar1 == false &amp;&amp; TestVar2 == false) { form.textbox.value = ""; } } &lt;/SCRIPT&gt; &lt;/HEAD&gt; &lt;BODY&gt; &lt;FORM NAME="myform" ACTION="" METHOD="POST"&gt;Choose a Color: &lt;BR&gt; &lt;INPUT TYPE="radio" NAME="input" VALUE="red"&gt;red&lt;P&gt; &lt;INPUT TYPE="radio" NAME="input" VALUE="blue"&gt;blue&lt;P&gt; &lt;INPUT TYPE="button" NAME="button" VALUE="Click" onClick="testResults(this.form)"&gt; &lt;P&gt;Selected:&lt;/P&gt; &lt;INPUT TYPE="text" ID="textbox" NAME="selected" VALUE=""&gt;&lt;/div&gt;&lt;p&gt; &lt;/FORM&gt; &lt;/BODY&gt; &lt;/HTML&gt; </code></pre>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload