JavaScript 在 PHP 之前没有响应（表单操作 = “php 文件” onsubmit = “表单的字段验证功能”

Question

I have investigated for a long time (too long) on the net (including StackOverflow eg) without any success. The question is asked by many people but no one among the proposed solutions helps me. So in desperation, I turn again to this forum.

<form id="myForm" method="post" action="updateMySQLGuests.php" onsubmit="return formSubmit()">

This boolean result function checks whether the value of the fields is correct before calling UpdateMySQLGuests.php (for example, verify if the e-mail contains a @ ) to create a record with the value of these form fields by POST method in MySQL. But action= updateMySQLGuests.php is executed before the formSubmit() function (which, in fact, is not executed at all). I work in localhost with Wampserver.

Answer 1

You can move the form's action to formSubmit() to solve this

<form id="myForm" method="post" onsubmit="return formSubmit()">

and the formSubmit() code:

function formSubmit() {
  // the old code
  ...

  // call submit form
  document.getElementById('myForm').action = "updateMySQLGuests.php";
  document.getElementById('myForm').submit();

}

Answer 2

<!--  in place of <form name= "myForm" id="myForm" action="updateMySQLGuests.php" method="post" onsubmit="return formSubmit()"> : -->

<form name="myForm" id="myForm" action="updateMySQLGuests.php" method="post">
    <!-- action="updateMySQLGuests.php" -->
    <label for="firstnames">Prénom:</label>
    <input type="text" id="firstname" size="20" name="firstname"><br>
    <label for="Lastnames">Nom:</label>
    <input type="text" id="lastname" size="20" name="lastname" list="lstLastnames">
    <datalist id="lstLastnames"> </datalist> <br>
    <label for="email">E-mail:</label>
    <input type="text" id="email" size="20" name="email"><br><br>

    <!-- in place of <input type="submit" value="post"/> : -->

    <button onclick="return validateValues()">Submit</button>
</form>