Validation formulaire affichage div

Signaler
Messages postés
15
Date d'inscription
samedi 3 septembre 2011
Statut
Membre
Dernière intervention
18 janvier 2012
-
Messages postés
15
Date d'inscription
samedi 3 septembre 2011
Statut
Membre
Dernière intervention
18 janvier 2012
-
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é ! \n");
}

// validation du mail
if(estVide(document.getElementById("txtMail")) == true )
{
tabErreurs.push(" - Le mail n'est pas renseigné ! \n");
}else{
if(estMailValide(document.getElementById("txtMail")) == false)
{
tabErreurs.push(" - Le mail saisie n'est pas correcte ! \n")
}
}
// 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) :\n' + 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...

14 réponses

Messages postés
15
Date d'inscription
samedi 3 septembre 2011
Statut
Membre
Dernière intervention
18 janvier 2012

un p'tit up !!!
je suis perdu please...
Messages postés
86
Date d'inscription
mardi 10 septembre 2002
Statut
Membre
Dernière intervention
17 mai 2013

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
Messages postés
15
Date d'inscription
samedi 3 septembre 2011
Statut
Membre
Dernière intervention
18 janvier 2012

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 !
Messages postés
15
Date d'inscription
samedi 3 septembre 2011
Statut
Membre
Dernière intervention
18 janvier 2012

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é ! \n");
}

// validation du mail
if(estVide(document.getElementById("txtMail")) == true )
{
tabErreurs.push(" - Le mail n'est pas renseigné ! \n");
}else{
if(estMailValide(document.getElementById("txtMail")) == false)
{
tabErreurs.push(" - Le mail saisie n'est pas correcte ! \n")
}
}
// 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) :\n' + message);
}

}
Messages postés
86
Date d'inscription
mardi 10 septembre 2002
Statut
Membre
Dernière intervention
17 mai 2013

si tu commentes cette ligne, tu verras ton div ...

document.forms[0].submit();

c'est le submit qui appelle l'autre page



jako
Messages postés
15
Date d'inscription
samedi 3 septembre 2011
Statut
Membre
Dernière intervention
18 janvier 2012

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 !
Messages postés
86
Date d'inscription
mardi 10 septembre 2002
Statut
Membre
Dernière intervention
17 mai 2013

<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
Messages postés
15
Date d'inscription
samedi 3 septembre 2011
Statut
Membre
Dernière intervention
18 janvier 2012

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
Messages postés
86
Date d'inscription
mardi 10 septembre 2002
Statut
Membre
Dernière intervention
17 mai 2013

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
Messages postés
15
Date d'inscription
samedi 3 septembre 2011
Statut
Membre
Dernière intervention
18 janvier 2012

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);

}
Messages postés
86
Date d'inscription
mardi 10 septembre 2002
Statut
Membre
Dernière intervention
17 mai 2013

Si je comprends bien, ton formulaire est dans cette page php ...

Pourrais-tu communiquer TOUT ton code (du début à la fin) ?


jako
Messages postés
15
Date d'inscription
samedi 3 septembre 2011
Statut
Membre
Dernière intervention
18 janvier 2012

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é ! \n");
}

// validation du mail
if(estVide(document.getElementById("txtMail")) == true )
{
tabErreurs.push(" - Le mail n'est pas renseigné ! \n");
}else{
if(estMailValide(document.getElementById("txtMail")) == false)
{
tabErreurs.push(" - Le mail saisie n'est pas correcte ! \n")
}
}
// 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’Adobe Flash Player.

http://www.adobe.com/go/getflashplayer






























Le contenu de cette page nécessite une version plus récente d’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 :






















Messages postés
15
Date d'inscription
samedi 3 septembre 2011
Statut
Membre
Dernière intervention
18 janvier 2012

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 ?
Messages postés
15
Date d'inscription
samedi 3 septembre 2011
Statut
Membre
Dernière intervention
18 janvier 2012

personne ...