How to make my reset button work in HTML without the form?

Question

here is my code

I have tried using javascript with onClick but then my submit button won't work. Then I tried changing it into the normal button and it still won't work. I tried putting it into the form and still won't work. So, I don't know how to reset the button for my form. This is my school work and I'm still a student so please help me. I would appreciate your help soo much.

Answer 1

The Form types: reset and submit need a context. I mean you have to wrap all inputs inside a form. <form>....</from> . Then reset has the context to reset all fields inside his context / form.

Otherwise if you dont want use form you can do it by Javascript.

 function reset() { document.getElementById('input_1').value = '' document.getElementById('input_2').value = '' }

 <input id="input_1" value="Hello"><br/> <input id="input_2" value="World"> <br/> <button onclick="reset()">RESET</buton>

Answer 2

You should use javascript for reset your inputs

Notice: Keep in mind that the Enter key also works when using the form

<div>
    <div id="like-form">
        <input type="text" placeholder="Name" />
        <input type="email" placeholder="Email" />
        <input type="password" placeholder="Password" />
    </div>

    <button type="button" id="like-reset">
        Reset
    </button>
</div>

You can use Ajax to submit information, But to reset

document.getElementById("like-reset").addEventListener("click" () => {

    // forEach
    [].slice.call(document.getElementById("like-form").children).forEach(input => {
        input.value = "";
    });

    // For
    const inputs = document.getElementById("like-form").children;
    for (let i = 0; i < inputs.length; i++) {
        inputs[i].value = "";
    }
});

Answer 3

U should set all inputs and reset button inside form. Like so:

<form>
  <input type="text">
  <input type="reset" value="Reset">
</form>

That way it should work.