How can I get form value and push it to array ? (fixing code)

Question

I am trying to code my first hangman.

I need to take the value from the html input and store it into an array.

I tried to store the value using a submit button, called "Guess".

<form>
<input type="text" maxlength="1" minlength="1" name="letter" id="letter" placeholder="Guess a letter" />

<button class="guess" name="guess" type="button" value="Guess">Guess</button>

<button id="restart" name="restart" type="button">Restart</button>
</form>

const guessButton = document.querySelector(".guess");


//empty array to store letters
guesses = [];
//store letter in array 

guessButton.addEventListener("submit", e=> {
    e.preventDefault();

    const letter = document.querySelector("#letter").value;
    //store letter in array 
    guesses.push(letter);
    console.log(guesses);
});

There is no result, it seems I cannot obtain the value.

Thank you for the support!

GuessButton will not fire an event submit, submit will work on form elements though. — Brainfeeder
– Brainfeeder, Commented Jun 21, 2019 at 13:09

Bosco · Accepted Answer · 2019-08-13 04:06:20Z

1

Try click instead of submit

var guessButton = document.querySelector("#guess");


//empty array to store letters
var guesses = [];
//store letter in array 

guessButton.addEventListener("click", e=> {
    e.preventDefault();

    var letter = document.querySelector("#letter").value;
    //store letter in array 
    guesses.push(letter);
    console.log(guesses);
});

<html>
    <head>
            <title>Ex</title>
    </head>

    <body>
        <form>
            <input type="text" maxlength="1" minlength="1" name="letter" id="letter" placeholder="Guess a letter" />
            
            <button class="guess" id="guess" name="guess" type="button" value="Guess">Guess</button>
            
            <button id="restart" name="restart" type="button">Restart</button>
            </form>  
                
    </body>
</html>

edited Aug 13, 2019 at 4:06

answered Jun 21, 2019 at 13:07

Bosco

1,5522 gold badges14 silver badges25 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How can I get form value and push it to array ? (fixing code)

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related