validation formulaire affichage div

Question

Bonjour,
Tout nouveau tout frais dans le monde de la programmation, je découvre vite mes limites et le travaille qui me reste a accomplir pour pouvoir faire fonctionner un code.
Je me tourne vers vous car cela fait plus d'une semaine que je seche totalement, malgre les nombreuses recherche a travers les forums
Je m'explique, j'ai un formulaire ou dedans grace au JS je verifie si le nom est bien entré et si le mail est valide, suite a ça j'aimerai que si le formulaire est validez qu'il m'affiche une div cacher.
je vous laisse mon bout de code

JS
function validerFormulaire()
{

var tabErreurs = new Array ();
//validation de l'entreprise
if(estVide(document.getElementById("txtEntreprise")) == true )
{
tabErreurs.push(" - Le nom de votre entreprise n'est pas renseigné ! 
");
}

// validation du mail
if(estVide(document.getElementById("txtMail")) == true )
{
tabErreurs.push(" - Le mail n'est pas renseigné ! 
");
}else{
if(estMailValide(document.getElementById("txtMail")) == false)
{
tabErreurs.push(" - Le mail saisie n'est pas correcte ! 
")
}
}
// ici je regarde le nombre de ligne dans tabErreurs
// si tabErreurs est vide, cela signifie qu'il y a pas d'erreurs, formulaire validé
// sinon afficher les erreurs
if(tabErreurs.length == 0)
{
alert("Vous pouvez acceder au tarif");
document.forms[0].submit();
}else{
// il y a des erreurs de saisie
var message ="";
for(var i=0; i<tabErreurs.length ; i++)
{
message += tabErreurs[i];			
}

alert('Erreur(s) :
' + message);
}

}


// verifie si un champ est vide
function estVide(champTxt)
{
if(champTxt.value == "")
{
return true;
}else{
return false;
}
}

// verifie si un texte mail est valide
function estMailValide (champMail)
{
var estValide = false;
var positionA = champMail.value.indexOf("@");
var positionP = champMail.value.lastIndexOf(".");

if(positionA != -1)
{
if(positionA < positionP)
{
estValide = true;
}
}
return estValide;
  	
}

en html:
<form id="form2" name="form2" method="post" action="">






div a afficher si formulaire bien rempli




Si vous plait éclairer ma lanterne...

CWam22 · Answer

un p'tit up !!!
je suis perdu please...

jmeunier · Answer

Je ne comprends pas bien ...

Si tu valides le formulaire, celui-ci disparaît et c'est ta page appelée dans "action" qui est affichée.

jako

CWam22 · Answer

nan du tout, j'ai du mal m'expliquer ! et je m'en excuse...
en faite une fois le formulaire valider (mail et nom = ok, verifier par le JS), je souhaiterai qu'il m'afficher la div cacher !

CWam22 · Answer

j'arrive a ouvrir la div cacher quand le formulaire est bon, mais la div reste afficher une micro seconde !
dans le JS dans la fonction j'ai rajouter:

function validerFormulaire()
{

var tabErreurs = new Array ();
//validation de l'entreprise
if(estVide(document.getElementById("txtEntreprise")) == true )
{
tabErreurs.push(" - Le nom de votre entreprise n'est pas renseigné ! 
");
}

// validation du mail
if(estVide(document.getElementById("txtMail")) == true )
{
tabErreurs.push(" - Le mail n'est pas renseigné ! 
");
}else{
if(estMailValide(document.getElementById("txtMail")) == false)
{
tabErreurs.push(" - Le mail saisie n'est pas correcte ! 
")
}
}
// ici je regarde le nombre de ligne dans tabErreurs
// si tabErreurs est vide, cela signifie qu'il y a pas d'erreurs, formulaire validé
// sinon afficher les erreurs
if(tabErreurs.length == 0)
{
document.getElementById('prixVl').style.display='block';
document.forms[0].submit();

}else{
// il y a des erreurs de saisie
var message ="";
for(var i=0; i<tabErreurs.length ; i++)
{
message += tabErreurs[i];			
}

alert('Erreur(s) :
' + message);
}

}

jmeunier · Answer

si tu commentes cette ligne, tu verras ton div ...

document.forms[0].submit(); 

c'est le submit qui appelle l'autre page



jako

CWam22 · Answer

le submit envoie les infos que je recupere dans ma bdd. mais je ne veux pas qu'il me redirige vers une autre page.
je veux juste qu'il m'affiche une div ! 
que rajouter ? je ne comprend pas ce que tu veux me faire dire !

jmeunier · Answer

<form id="form2" name="form2" method="post" action=""> 

je suppose que dans "action" tu as indiqué une page (php par exemple) qui reçoit ton formulaire et qui traite les informations ..?
et c'est cette page qui s'affiche lors de ton submit
c'est le principe.


Maintenant si tu veux rtavailler "en tâche de fond", AJAX est ton ami


jako

CWam22 · Answer

non du tout les infos je les recupere et je les envoie directe. mais je reste sur cette meme page.
Ajax oulaaaa je connais rien du tout la dedans ! mais il y a pas un moyen dans le JS pour afficher ma div cacher une fois le bouton submit enclenché ?
en tout merci jako de ton aide

jmeunier · Answer

les infos je les récupère et je les envoie direct.


comment fais-tu pour récupérer les infos et les traiter ?
je ne vois ça nulle part dans ton code ...


jako

CWam22 · Answer

c'est vrai je n'ai pas mis le php. mais le voici, si jamais ça peut t'aider

<?php session_start();
include("../connexion.php");

if(isset($_POST["btn_contact"]))
{

$insertContact = "INSERT INTO carnet_contact ( societe, mail) VALUES ('%s', '%s')";
$insertSQLcarnet = sprintf($insertContact,
addslashes($_POST["txtEntreprise"]),
addslashes($_POST["txtMail"]));	
mysql_query($insertSQLcarnet,$maconnexion);

}

jmeunier · Answer

Si je comprends bien, ton formulaire est dans cette page php ...

Pourrais-tu communiquer TOUT ton code (du début à la fin) ?


jako

CWam22 · Answer

bien sur pas de souci, voici mon code entier:




Transport Chrono's - Véhicule & Tarifs


 
function choixVehicule(chaine)
{
var a= document.getElementById("txtVl");
var b= document.getElementById("txtPl");
var c= document.getElementById("txtGrue");
var d= document.getElementById("txtChar");
var a2=document.getElementById("prixVl");
var b2=document.getElementById("prixPl");
var c2=document.getElementById("prixGrue");
var d2=document.getElementById("prixChar");

if (chaine == 'cacher1'){

a.style.display = "block";
a2.style.display = "block";
b.style.display = "none";
b2.style.display = "none";
c.style.display = "none";
c2.style.display = "none";
d.style.display = "none";
d2.style.display = "none";
}
else if (chaine == 'cacher2'){

a.style.display = "none";
a2.style.display = "none";
b.style.display = "block";
b2.style.display = "block";
c.style.display = "none";
c2.style.display = "none";
d.style.display = "none";
d2.style.display = "none";
}

else if (chaine == 'cacher3'){
a.style.display = "none";
a2.style.display = "none";
b.style.display = "none";
b2.style.display = "none";
c.style.display = "block";
c2.style.display = "block";
d.style.display = "none";
d2.style.display = "none";
}

else if (chaine == 'cacher4'){
a.style.display = "none";
a2.style.display = "none";
b.style.display = "none";
b2.style.display = "none";
c.style.display = "none";
c2.style.display = "none";
d.style.display = "block";
d2.style.display = "block";
}

}

function validerFormulaire()
{

var tabErreurs = new Array ();
//validation de l'entreprise
if(estVide(document.getElementById("txtEntreprise")) == true )
{
tabErreurs.push(" - Le nom de votre entreprise n'est pas renseigné ! 
");
}

// validation du mail
if(estVide(document.getElementById("txtMail")) == true )
{
tabErreurs.push(" - Le mail n'est pas renseigné ! 
");
}else{
if(estMailValide(document.getElementById("txtMail")) == false)
{
tabErreurs.push(" - Le mail saisie n'est pas correcte ! 
")
}
}
// ici je regarde le nombre de ligne dans tabErreurs
// si tabErreurs est vide, cela signifie qu'il y a pas d'erreurs, formulaire validé
// sinon afficher les erreurs
if(tabErreurs.length == 0)


{
document.forms[0].submit();


}else{
// il y a des erreurs de saisie
var message ="";
for(var i=0; i
      
      
        
        
        
        
        
        
        

          Le contenu de cette page nécessite une version plus récente d&#8217;Adobe Flash Player.

          http://www.adobe.com/go/getflashplayer


        

        
      
      
    
  

  
 
    
      
      
      
      
      
      
      
      
      
        
        
        
        
        
        
        

          Le contenu de cette page nécessite une version plus récente d&#8217;Adobe Flash Player.

          http://www.adobe.com/go/getflashplayer


        

        
      
      
    
  

  
  

     


    Selectionnez un véhicule :


    ,
,
,


----

 Véhicule leger,
 Poids lourd,
 Poids lourd Grue,

----

 Porte chars,



   
    
  

  
  

    

Caractéristiques du véhicule:


    
    






 	

    

    
   

    
 
    	  " width="398" height="238" class="cara_img_float" "" />
  " width="400" height="243" class="cara_img_floatdroite" "" />

    
    











 	

    

    
   

    

    

    	  " width="398" height="238" class="cara_img_float" "" />
 	  " width="400" height="243" class="cara_img_floatdroite" "" />


    





    

  

  
  

    
  
  
  
 


Si vous souhaitez acceder au tarif, merci de rensigner les champs suivants:,

----

nom de votre societé :,


,

----

adresse mail :,


,

----





  
  
   


  Vous êtes déja client ?

entrez le nom de votre societé:,

----

,

----


   


   


   


   


   


 


   


  

  


  
 



 	
Zone 1: 0 > 20 km,
,

----

Zone 2: 21 > 40 km,
,

----

Zone 3: 41 > 60 km,
,

----

Location demi journée,
,

----

Location journée,
,

----

HORS ZONE (Sup. à 61 Km)  , Locations au mois :





    

    	
   



Zone 1: 0 > 20 km,
,

----

Zone 2: 21 > 40 km,
,

----

Zone 3: 41 > 60 km,
,

----

Location demi journée,
,

----

Location journée,
,

----

HORS ZONE (Sup. à 61 Km)  , Locations au mois : 



  
     


    
   



Zone 1: 0 > 20 km,
,

----

Zone 2: 21 > 40 km,
,

----

Zone 3: 41 > 60 km,
,

----

Location demi journée,
,

----

Location journée,
,

----

HORS ZONE (Sup. à 61 Km)  , Locations au mois : 



   
     

    

   



Zone 1: 0 > 20 km,
,

----

Zone 2: 21 > 40 km,
,

----

Zone 3: 41 > 60 km,
,

----

Location demi journée,
,

----

Location journée,
,

----

HORS ZONE (Sup. à 61 Km)  , Locations au mois :

CWam22 · Answer

je me posais une question, pour faire plus simple sans se prendre la tete, je pourrais re crée une autre page, copiez coller du code, avec la div apparante !
donc je n'aurait qu'as faire une redirection dans le javascript vers la bonne page, mais j'ai le meme souci ou mettre ma redirection dans mon JS ?

CWam22 · Answer

personne ...

Validation formulaire affichage div

14 réponses

Votre réponse

Discussions similaires