I have a page where I have a form for signin and an another for signup. But when I click either on singin or signup button it's always the signup form who is sent. Where is my error ? PHP CODE :

if($_SERVER['REQUEST_METHOD'] == "POST")
    {
      if ($_POST['modification'] == 1)      
      {
        alert("Signin");
      }
      if ($_POST['modification'] == 2) 
      {
        alert("Signup");
      }
    }

HTML CODE :

           <div >
            <div >
              <form id="connecter" name="connecter" method="post">
                <div >

                  <div >
                    <fieldset>
                      <input name="txtIdentifiant" type="text"  id="txtIdentifiant" placeholder="Identifiant" required="">
                    </fieldset>
                  </div>

                  <div >
                    <fieldset>
                      <input name="txtMotDePasse" type="text"  id="txtMotDePasse" placeholder="Mot de passe" required="">
                    </fieldset>
                  </div>

                  <div >
                    <fieldset>
                      <button type="submit" id="btnConnecter" name="btnConnecter"  form="connecter" value="btnConnecter">Se connecter</button>
                      <input type="hidden" name="modification" value="1" />
                    </fieldset>
                  </div>
                </div>
              </form>
            </div>
          </div>

          <div >
            <div >
              <form id="inscrire" name="inscrire" method="post">
                <div >

                  <div >
                    <fieldset>
                      <input name="txtPrenom" type="text"  id="txtPrenom" placeholder="Prénom" required="">
                    </fieldset>
                  </div>

                  <div >
                    <fieldset>
                      <input name="txtNom" type="text"  id="txtNom" placeholder="Nom" required="">
                    </fieldset>
                  </div>

                   <div >
                    <fieldset>
                      <input name="txtGSM" type="text"  id="txtGSM" placeholder="Numéro de GSM" required="">
                    </fieldset>
                  </div>

                  <div >
                    <fieldset>
                      <input name="txtAdresseMail" type="text"  id="txtAdresseMail" placeholder="Email" required="">
                    </fieldset>
                  </div>

                  <div >
                    <fieldset>
                      <input name="txtIdentifiantInscription" type="text"  id="txtIdentifiantInscription" placeholder="Identifiant" required="">
                    </fieldset>
                  </div>

                  <div >
                    <fieldset>
                      <input name="txtMotDePasseInscription" type="text"  id="txtMotDePasseInscription" placeholder="Mot de passe" required="">
                    </fieldset>
                  </div>

                  <div >
                    <fieldset>
                      <button type="submit" id="btnCreerCompte" name="btnCreerCompte"  form="inscrire" value="btnCreerCompte">S'inscrire</button>
                      <input type="hidden" name="modification" value="2"/>
                    </fieldset>       
                  </div>
                </div>
              </form>
            </div>
          </div>

AJAX CODE :

<script type="text/javascript">
  $('#btnConnecter').on('click',function(e){
   //prevent submitting form
   e.preventDefault();
  
   //Get Input Values
   var identifiant = document.getElementById("txtIdentifiant").value;
   var motDePasse = document.getElementById("txtMotDePasse").value;
   

   //Form Validation
   if (identifiant && motDePasse)
   {
             //Call Ajax to check if user existed
            $.ajax({ 
            type    : "POST",
            url     : "check-signin.php",
            dataType: "json",
            data: 
            {
              identifiant: identifiant, motDePasse: motDePasse
            },           
            success:function(result) 
            {
               // alert(result.msg);
               if (result.msg == "Success")
               {
                    e.preventDefault();
                    //Submit form if user not existed
                    $('form').submit(); 
                    //alert("Ajax ok");
               }
               else if (result.msg == "Failed")
               {
                    e.preventDefault();
                    alert("Identifiant/Mot de passe incorrect");
                    //C'est chaud
                    document.getElementById("txtIdentifiant").focus();
                    return false;
               }
               else if (result.msg == "Active")
               {
                    e.preventDefault();
                    alert("Veuillez activer votre compte");
                    document.getElementById("txtIdentifiant").focus();
                    return false;
               }
               
            }
            });
   }
   else
   {
      alert("Veuillez remplir tout les champs");
      return false;
   }
});
  </script>

    <script type="text/javascript">

    $('#btnCreerCompte').on('click',function(e){
   e.preventDefault();
  
   var prenom = document.getElementById("txtPrenom").value;
   var nom = document.getElementById("txtNom").value;
   var mail = document.getElementById("txtAdresseMail").value;
   var numGSM = document.getElementById("txtGSM").value;
   var minGSM = document.getElementById("txtGSM").length;
   var identifiant = document.getElementById("txtIdentifiantInscription").value;
   var motDePasse = document.getElementById("txtMotDePasseInscription").value;
   
   if (prenom && nom && mail && numGSM && identifiant && motDePasse)
   {
        if (isNaN(numGSM) || numGSM.length < 7)
        {
           alert("Numéro de gsm non valide");
           //Phone number invalid
           document.getElementById("txtGSM").focus();
           return false;
        }
        else if (validateEmail(mail))
        {
            $.ajax({ 
            type    : "POST",
            url     : "check-user.php",
            dataType: "json",
            data: {
             identifiant: identifiant
             },           
            success:function(result) 
            {
               if (result.msg == "Success")
               {
                    e.preventDefault();
                    $('form').submit(); 
               }
               else if (result.msg == "Failed")
               {
                    e.preventDefault();
                    alert("Identifiant déjà existant");
                    document.getElementById("txtIdentifiantInscription").focus();
                    return false;
               }
            }
            });
       }
       else 
       {
            alert("Adresse mail incorrecte");
            document.getElementById("txtAdresseMail").focus();
            return false;
       }
   }
   else
   {
      alert("Veuillez remplir tout les champs");
      return false;
   }
});
</script>

Is it Ajax that break the php submit ? Because I have the double form in the client section where he can change either his information or his password, and it work over there, I don't know why here it won't work :( Thank you guys !

CodePudding user response：

So I test one or two things, and I somehow make it work like this :

HTML CODE :

     <button type="submit" id="btn" name="btn"  form="connecter" value="btnConnecter">Se connecter</button>
     <input type="hidden" name="btn" value="btnConnecter" />
     <button type="submit" id="btn" name="btn"  form="inscrire" value="btnCreerCompte">S'inscrire</button>
     <input type="hidden" name="btn" value="btnCreerCompte"/>

PHP CODE :

if($_SERVER['REQUEST_METHOD'] == "POST")
{
  if ($_POST['btn'] == 'btnConnecter')      
  {
    alert("Je suis dedans co");
  }
  else if ($_POST['btn'] == 'btnCreerCompte') 
  {
    alert("Je suis dedans ins");
  }
  else
  {
    alert("Rien fonctionne");
  }
}

Thank for the attention guys

CodePudding user response：

do not use button type="submit":

Update to:
<button id="btnCreerCompte" name="btnCreerCompte"  form="inscrire" value="btnCreerCompte">S'inscrire</button>
or:
<input type="button" value="S'inscrire" onclick="submitFormCreerCompte()">
And in the scripts create function "submitFormCreerCompte()" and call ajax to submit form