adding a reset button in javascript

Question

I am very green and starting to learn JS, just started my small project for practice. I found my "reset" button is no longer working, would you guys pls hv some comments? Thanks a lot.

<input type="button" value="Reset" onclick="clear()">
function clear(){
document.getElementById("result").value.reset();}

FormElement.reset() resets a form, if that's what you want... or maybe you want something like document.getElementById('result').value = 'some value here'; — StackSlave
– StackSlave, Commented Jun 30, 2020 at 4:42
Yea, Although my question is stupid but you guys are helpful, thanks. — willaim
– willaim, Commented Jun 30, 2020 at 4:58

djcaesar9114 · Accepted Answer · 2020-06-30 04:49:56Z

3

Watch out, clear is already taken, you should rename your function:

function clearResult(){
  document.getElementById("result").value = ''
}

<input id="result" type="text" />
<input type="button" value="Reset" onclick="clearResult()">

See for example https://developer.mozilla.org/fr/docs/Web/API/Document/clear

answered Jun 30, 2020 at 4:49

djcaesar9114

2,1472 gold badges30 silver badges51 bronze badges

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

Comments

Nripesh Poudel · Accepted Answer · 2020-06-30 06:52:38Z

There are two ways to solve this error that I figured out. First thing if you want to use reset() then, use the following code:

<form id="result">
<input type="text">
  <input type="button" value="Reset" onclick="clear1()"></form>
<script>
function clear1(){
  document.getElementById("result").reset();}</script>

So if you see here, I have used the tag. Three errors I found in your markup were:

clear() method is already reserved in javascript. clear() method in JavaScript is used for the removal of all the elements from a map and make it empty. So, instead use any other function name like clear1() just like I did.
reset() function works for the tag. So instead of giving input tag an id give that id to the tag.
You don't have to use the value in reset() method Use this method when you have a lot of input tags to perform with. Just wrap it with a tag.

Another method is easy when you have only one or two tags.

<input type="text" id="result">
  <input type="button" value="Reset" onclick="clear1()">

<script>
function clear1(){
document.getElementById("result").value= ''}
</script>

ABGR · Accepted Answer · 2020-06-30 07:18:20Z

0

Change

document.getElementById("result").value.reset()

to

document.getElementById("reset").reset();

And also, rename clear to some other function as clear is a reserved word and does something entirely different.

 function myFunc() {
     document.getElementById("reset").reset();
 }

  <form id="reset">
    Name<br><input type="text"  name=""><br>
    foo<br><input type="text" name=""><br>
    <input type="button" onclick="myFunc()" value="Reset">
 </form>

edited Jun 30, 2020 at 7:18

answered Jun 30, 2020 at 4:57

ABGR

5,2634 gold badges34 silver badges56 bronze badges

Collectives™ on Stack Overflow

adding a reset button in javascript

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related