Question

I am automating a document with HTML and JavaScript through MS Notepad. So far, I have lots of text, a few textboxes, and a button, which will execute a JavaScript function after a number is entered into one of the textboxes. This document is only partially completed; however, I noticed that after I add entries into my textboxes and then press the button, all of my entries erase. I believe this is a postback issue of some sort; however, I thought using an onlick event with JavaScript would not execute a server-side command. Also, my document is all client-side code. Basically, it is just text, HTML, and, currently, one JS function.

As a reiteration, would anyone know why my textbox entries erase after a button’s onclick event executes, and how to stop this from happening? Additionally, the onclick event executes the JS function, which is an if statement that adds more text to the document.

Thank you,

DFM

Answer 1

If you have an <input type="submit"> button in your form then when you press the button the form will get submitted, even if you have an onclick handler. There are several ways to solve this*, but the easiest way is to change the button to type="button", which is identical except clicking it does not submit anything.

<input type="button" onclick="checkEntries()" />

*Other solutions include adding return false to your onclick handler, as in onclick="checkEntries(); return false", or adding onsubmit="return false" to the <form> element.