Geek Answers Handbook

Javascript onsubmit not working

I am trying to make javascript work to submit a form, the function does not seem to start. Can anyone help?

<html> <head> <script> function upload(){ alert("I am an alert box!"); } </script> </head> <body> <form enctype="multipart/form-data" method="post" onsubmit="return upload();"> <input type="file" name="file"> <input type="submit" name="upload" value="Datei hochladen"> </form> </body> </html>
+11
javascript onsubmit
source share
2 answers

When attaching an event handler to a form element, the scope of the event handler is a form, not a window

 <form enctype="multipart/form-data" method="post" onsubmit="return upload(this);"> <script> function upload(scope) { console.log(scope); // The passed scope from the event handler is } // the form, and not window </script>

Since the input elements inside the form are attached as properties to the form object, where the name is the key, calling upload() in the event handler, where the scope is the form, will be equal to calling form.upload() , but form already has an element with that name, therefore form.upload is a upload button, not a upload() function in the global area.

Rename a function or item to resolve this issue.

 <html> <head> <script> function upload(){ alert("I am an alert box!"); } </script> </head> <body> <form enctype="multipart/form-data" method="post" onsubmit="return upload();"> <input type="file" name="file"> <input type="submit" name="upload2" value="Datei hochladen"> </form> </body> </html>

Fiddle

+20
source share

Add return statement to your code

 <script> function upload(){ alert("I am an alert box!"); return false; } </script>
-2
source share

More articles:


All Articles