Javascript code is not working properly. please help!

Question

This tiny Js code is not working properly. Actually it is not correctly showing the status of progress bar. Dont know why. Please help me figure it out. link to code is given below:

https://code.sololearn.com/W0A16a0a203A

Answer 1

your button (<input type="submit">) is a submit button, meaning it try as default behavior to query a page by sending form data to server after the onclick event...

the simplest way to fix it (load a new blank page as no url was provided in the associated form) is to change type to "button" and add a value attribute (wich reflect the button text):

<input onclick="progStat()" type='button' value="apply">

Answer 2

https://code.sololearn.com/Wyb9ANlYifG1/?ref=app

Answer 3

Thanks you so much guys. I realized my mistake.

Answer 4

because without form context <button> has no special meaning/behavior, but inside form context, default behavior of button is type="submit": you must add type="button" to it inside form to let it work without submitting the form ;)

Answer 5

But I'm wondering why <button> element is not working inside <form> element. It is working outside. While <input> element is working inside it.

Answer 6

visph Got it. Thanks.