Form submit button won't work

Question

I can see no problems with my code but whenever I push the submit button, nothing happens:

<form id = "form_signin_containers" action = "" method = "post"> <input type = "text" name = "si_idnumber" placeholder = "ID Number" required/> <input type = "password" name = "si_password" placeholder = "Password" required/> <input type = "submit" name = "si_submit" value = " sign in "> </form>

I tried adding an isset button to the php code above my html code to test it out:

if(isset($_POST['si_submit'])) { header("Location:home.php"); }

When I press the submit button it still won't work. I also noticed, since I put a <...required/> on all the textbox, if I should click the submit button, it would notify me if the textboxes are empty right? But still when I leave the textboxes blank and presses the submit button, it won't do anything, it won't even tell me that the textboxes are empty. As if the button is dead.

UPDATE
I have this javascript that I placed right before the </body> that will make the page scroll smoothly whenever I click an anchor button.
Sample of my anchor buttons:

<form id = "form_createaccount_button" action="#createchooserblink"> <input type="submit" value=" create account " /> </form>

The JS:

<script> $(function() { $('input').click(function(e) { e.preventDefault(); var hash = $(this).parent('form').attr('action'); var target = $(hash); target = target.length ? target : $('[name=' + hash.slice(1) +']'); if (target.length) { $('html, body').animate({ scrollTop: target.offset().top }, 1000); } }); }); </script>

Could this be affecting the login forms?

either your browser is old, or there is some javascript interrupting how these things work. required has to work — Nodir Rashidov
– Nodir Rashidov, Commented Mar 28, 2017 at 5:19
@JapanGuy yeah I just posted an update regarding js that I used... could this be the problem? — Dranreb
– Dranreb, Commented Mar 28, 2017 at 5:21
@devpro Yeah.. I do this often times. Is this a bad thing? I also feel insecure about it too. I used it to connect my html button to my php code. — Dranreb
– Dranreb, Commented Mar 28, 2017 at 5:28

T.J. Crowder · Accepted Answer · 2017-03-28 05:28:04Z

Yes, your JavaScript is preventing form submission:

$('input').click(function(e) { e.preventDefault(); // ...

Clicking the submit button triggers that click handler, and preventing the default action prevents form submission.

You could specifically leave the name="si_submit" button out of that by adding :not([name=si_submit]):

$('input:not([name=si_submit])').click(function(e) { e.preventDefault(); // ...

...but I think instead of doing that, I'd probably use a class or something on the "anchor buttons" (or not use the "anchor buttons" at all), and add that class instead. E.g.:

<form id = "form_createaccount_button" action="#createchooserblink"> <input type="submit" class="anchor-button" value=" create account " /> </form>

and:

$('input.anchor-button').click(function(e) { e.preventDefault(); // ...

Yeah Thanks! I just realized this too. I tried deleting the whole javascript and the forms work. Is there an alternative way or a modification of the JS that will make the forms work and would also trigger the smooth-scroll ?
@Dranreb: The :not or class options in the answer allow your "anchor buttons" to keep working without interfering with form submission.

Kobbe · Accepted Answer · 2017-03-28 05:22:16Z

Try this:

<form id="form_signin_containers" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>" method="post"> <input type="text" name="si_idnumber" placeholder="ID Number" required> <input type="password" name="si_password" placeholder="Password" required> <input type="submit" value="sign in"> </form>

Collectives™ on Stack Overflow

Form submit button won't work

2 Answers 2

4 Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

Comments

Related