HTML Displaying input results in a tag below

Question

I am currently lets the user input these choices in a form, under each element I'd like to put a p tag under each element that stats something like this

Radio: Review/Change
Policy Number: 123545
Last Name: Smith
First Name: Bob
Comments: bob is nice.

here is my current inputs.

<div class ="radio">
        <input type="radio" name="type" value="R" /> Review/Change<br/>
        <input type="radio" name="type" value="N" />New Business <br/>
        <input type="radio" name="type"  value="H" />Hold/Trial <br/>
        <input type="radio" name="type"  value="B" /> Brokerage <br/>
    </div>
    <div class="information">
        <p> Policy Number: <input id="polNum" name="polNum" type="text"/></p>

        <p>Control Number:<input id="membNbr" name="membNbr" type="text"/></p>

        <p>Last Name or Business Name: <input id="lastName" name="lastName"  type="text"/></p>

        <p>First Name:<input id="firstName" name="firstName" type="text"/></p>

        <p>Comments:
            <textarea name="comment" id="comment" cols="30" rows="2"></textarea></p>

    </div>`

Please clarify your specific problem or add additional details to highlight exactly what you need. As it's currently written, it’s hard to tell exactly what you're asking. — Paulie_D, Sep 13 '17 at 14:54
can you give more details. I didn't understand your objectif. — Mohamed Bathaoui, Sep 13 '17 at 14:55
I'm sorry if I'm unclear in my question for each input tag I would like to put an additional p tag underneath for instance if you put your policy number in the input it should display that policy number in the tag under it. I'm not sure if this is possible with HTML or if I will need to use javascript — , Sep 13 '17 at 14:57
My personal suggestion is go read up on AngularJS or Angular. http://www.angularjshub.com/examples/basics/twowaydatabinding/ — , Sep 13 '17 at 14:57
Possible duplicate of [How do I get the value of text input field using JavaScript?](https://stackoverflow.com/questions/11563638/how-do-i-get-the-value-of-text-input-field-using-javascript) — DCR, Sep 13 '17 at 15:03

Tom O. · Accepted Answer · 2017-09-13T15:40:46.640

Below is an example of how to do this for radio buttons and textboxes.

function displayRadioSelection(radioValue) {

  document.getElementById("display_radioSelection").innerHTML = radioValue;
}

function displayPolicyNumber() {
  document.getElementById("display_policyNumber").innerHTML = document.getElementById("polNum").value;
}

.display {
  color: blue;
  font-size: small;
}

<div>
  <input type="radio" name="type" value="R" onclick="javascript: displayRadioSelection(this.value)" /> Review/Change<br/>

  <input type="radio" name="type" value="N" onclick="javascript: displayRadioSelection(this.value)" /> New Business
  <br/>

  <input type="radio" name="type" value="H" onclick="javascript: displayRadioSelection(this.value)" /> Hold/Trial
  <br/>

  <input type="radio" name="type" value="B" onclick="javascript: displayRadioSelection(this.value)" /> Brokerage
  <br/>

  <span class="display" id="display_radioSelection" />
</div>

<div>
  Policy Number:
  <input id="polNum" name="polNum" type="text" onkeyup="javascript:displayPolicyNumber()" />
  <br/>
  <span class="display" id="display_policyNumber" />
</div>

This is exactly what I'm trying to do! now for the radio buttons applied how would I do the same? — , Sep 13 '17 at 15:20
Radio buttons are a little more tricky than the other inputs. I added the code here to give an example of how to do it with the radio buttons. — Tom O., Sep 13 '17 at 15:33
@MarshallMunoz if this answers your question, could you please mark it as accepted? Thanks. — Tom O., Sep 13 '17 at 17:31

HTML Displaying input results in a tag below

1 Answers1