Question

46

How to get user input from javascript form?

rated 0 times [ 49] [ 3] / answers: 1 / hits: 41088 / 7 Years ago, wed, january 3, 2018, 12:00:00

so my question is pretty simple.

How to I get user input from a form and put it into a variable ?

Im struggling to do this simple task and would appreciate some help.

Here is my code :

html:

<body>

        <form>

            <input type=text id=input_id value=>

            <input type=submit value=Submit>

            <div id=alert style=color: red></div>

        </form>

    </body>

Javascript

    var a = document.getElementById('input_id').value;



function wawa() {

    return a;

}

document.getElementById('alert').innerHTML = user entered this value:  +   + a;

I would like to do this with vanilla JS and no library.

Thanks.

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

jaquelineh

Add To Favorites

Follow

Total Points: 360

Total Questions: 105

Total Answers: 114

Location: Saint Pierre and Miquelon

Member since Fri, Jan 28, 2022

2 Years ago

answered 7 Years ago emiliano · Accepted Answer

You don't need a variable outside your function. All you need is a button and an onclick event. The onclick event calls a function that checks input and writes to the <div>.

function wawa() {

  var variable = document.getElementById('input_id').value;

  document.getElementById('alert').innerHTML = 'The user input is: ' + variable;

}

<body>

  <form>

    <input type=text id=input_id value=>

    <input type=button value=Submit onclick=wawa() />

    <div id=alert style=color: red></div>

  </form>

</body>