表单提交按钮不起作用

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.

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?

Answer 1

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. Eg:

<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();
     // ...

Answer 2

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>