Pourquoi ma condition ne fonctionne pas

Fermé
flexi2202 Messages postés 3795 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 avril 2024 - 14 août 2013 à 23:21
flexi2202 Messages postés 3795 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 avril 2024 - 26 août 2013 à 00:32
bonsoir a tous
je reviens avec mon formulaire
je récapitule un peu son fonctionnement
en premier lieu le client entre ses coordonnées
ensuite le client choisit un pays pour la livraison et suivant le pays choisi un mode de livraison apparait sur la même page
Les modes de livraison sont fixe par la variable envoi

if($_POST['envoi'] == 1) $mode_envoi = "Kiala" ;//si kiala a ete choisi(poste.envoi=0)
elseif($_POST['envoi'] == 2) $mode_envoi = "la poste francaise" ;//si poste fr a ete choisi(poste.envoi=2)
elseif($_POST['envoi'] == 3) $mode_envoi = "Mondial relay" ;//si poste fr a ete choisi(poste.envoi=2)


donc si le client choisi la belgique
il peux être livrer par kiala
je souhaiterais donc qu il entre bien le nom du point kiala
j ai essayer avec ce code mais sans succès
<TABLE bgcolor=#9FB9B5 width="690"BORDER>
	<TR width="690">

	</TR>
		
	<TR width="690"height="6">
			<script type="text/javascript">
		
	if($_POST['envoi'] == 1) 
    { 		 function Verifie(aBC)
   {
   if(aBC.non_du_point_kiala.value == ""){
        alert('Vous n\'avez pas renseign\351 votre kiala.');
        return false;
   }
     }
    }	
		
		
	 </script> 
	
	
		<TD width="345"><font color="noir">Nom du point kiala (ex librairie ...)</font>
		</TD> 
		<TD width="345"> 
		<input size="45" name="non_du_point_kiala"><img align="absmiddle" id="adresse_ife_marker_3" src="chrome://informenter/skin/marker.png" class="ife_marker" style="border: 0pt none; width: 14px; height: 19px; cursor: pointer; display: inline;" title="La longueur du champ est inconnue">
		</TD> 
	</TR>
	<TR>


voici le lien du formulaire
https://www.000webhost.com/migrate?static=true

un tout grand merci pour l aide future

61 réponses

gardiendelanuit Messages postés 1769 Date d'inscription jeudi 20 décembre 2007 Statut Membre Dernière intervention 19 novembre 2016 264
15 août 2013 à 15:45
Bonjour,
Je ne comprend pas exactement ce que tu veux faire, tu mélanges le PHP et le JavaScript dans ton code.
0
flexi2202 Messages postés 3795 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 avril 2024 187
15 août 2013 à 16:58
Bonjour
merci pour la réponse
Avec l aide des membres de ce forum je suis arrive a faire ce formulaire

https://www.000webhost.com/migrate?static=true

qui fonctionne parfaitement , mais je souhaiterais encore l améliorer un peu , avec des conditions

Lorsque le client voit mon formulaire s afficher
il remplit ses coordonnées , choisit son pays
Et quand il choisit son pays , plus bas dans le formulaire s affiche ses modes d envois .
Par exemple pour la france
le client a le choix entre la poste et mondial relay
Ce que je souhaite c est que quand le client choisit mondial relay , que les champs pour cet envois soient obligatoire
0
BlackYoup Messages postés 181 Date d'inscription mardi 4 décembre 2012 Statut Membre Dernière intervention 10 juin 2014 20
15 août 2013 à 23:14
Salut :)

C'est vrai que j'ai aussi un peu de mal à comprendre. Mais si j'ai bien compris, dès que le client choisis sont type d'envoi, tu veux que les champs "Nom du point mondial relay (ex librairie ...)" et les 3 autres (pour le Mondial relay) soient obligatoirement remplis avant de commander ?

Dans ce cas, tu peux déja mettre le champs required="required" sur tous tes inputs. Cela permettra de bloquer l'envoi
Ensuite, pourquoi pas récupérer tous les input et les vérifier dans une boucle pour savoir s'ils ne sont pas vides ?

Tiens nous au courant
0
flexi2202 Messages postés 3795 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 avril 2024 187
Modifié par flexi2202 le 16/08/2013 à 08:20
bonjour
merci pour les reponses et pour votre aide
oui voila ce que je souhaite
donc
"Mais si j'ai bien compris, dès que le client choisis sont type d'envoi, tu veux que les champs "Nom du point mondial relay (ex librairie ...)" et les 3 autres (pour le Mondial relay) soient obligatoirement remplis avant de commander ? "

Voici les champs pour mondial relay

 <TD width="345"> 
  <input size="45" name="non_du_point_mondial_relay">
  </TD> 
 </TR>
 <TR>
  
  <TD>
        <input size="15" name="Localite_du_point_mondial_relay">
  </TD> 
 </TR>
 <TR>
  
  <TD><input size="15" name="code_postal_du_point_mondial_relay"><br></TD> 
 </TR>
 <TR>
  
  <TD>
        <input size="45" name="adresse_point_mondial_relay">
  </TD> 
 </TR>
  
</TABLE>  


..

je viens de faire un essai avec required="required"en le mettant sur les champs de kiala et de mondial relay ,Mais cela ne fonctionne pas

je m explique si le client choisi la belgique et pour que le formulaire me sois envoyé il doit remplir les champs pour mondial relay et pour kiala

en fait ce qui pourrait fonctionner c est par exemple si mondial relay est cocher vérifie les champs de mondial de relay uniquement , mais comment l interpréter en code
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
BlackYoup Messages postés 181 Date d'inscription mardi 4 décembre 2012 Statut Membre Dernière intervention 10 juin 2014 20
Modifié par BlackYoup le 16/08/2013 à 11:21
Alors moi j'avais essayé à la volée (en modifiant direct le DOM), le required marchait. Aussi, peut être faut-il que le tout soit dans un <form></form> ce qui n'est pas le cas :)

Pour vérifier que les inputs sont pleins, tu peux leur ajouter une classe par exemple :
class="classMondialRelay"

Puis, ajouter un id à ta table qui les recense :
<table bgcolor="#9FB9B5" width="690" border="" id="mondialRelay"></table>


Et après, en javascript, une fonction qui check si tout est remplis (un attribut onclick sur le submit par exemple). Bien sur, cette fonction se devra d'acceuillir un paramètre afin de savoir quel choix le client à fait. C'est pour ca qu'on va pouvoir la modifier via onClick du bouton radio:

<input type="radio" onclick="majPrixPort(this.form); document.getElementById('submitAll').setAttribute('onClick', 'checkInputs("mondialRelay", "classMondialRelay")');" value="3" name="envoi" id="by_mondial relay">


Une fois que la fonction a été modifiée, on peut checker les inputs

<input type="submit" value="commander" name="sub" style="font-size:2.85em;background-color : red;color:white;" onClick="checkInputs('mondialRelay', 'classMondialRelay');" id="submitAll">

<script>
function checkInputs(elementId, elementClass)
{
      var allInputs = document.getElementById(elementId).getElementsByTagName('input');

  for(var i = 0; i < allInputs.length; i++)
  {
     if(allInputs[i].className === elementClass && allInputs[i].value === '')
            alert("Un champs n'a pas été remplis"); // puis on bloque l'envoi du formulaire
  }
}
</script>


Voila, je pense que l'idée est la :)

PS: j'ai rajouté un ID à la table tout simplement pour ne récupérer que les inputs se trouvant à l'intérieur et non tous les inputs de la page ;)
0
flexi2202 Messages postés 3795 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 avril 2024 187
Modifié par flexi2202 le 17/08/2013 à 00:09
Bonsoir black youp
Avant toute chose un super grand merci pour ton aide aussi géniale
je tiens également a remercier les autres membres qui m ont déjà tellement aide


si je peux me permettre je vais poster mon formulaire en ayant pris soin d enlever un maximum de chose inutile et expliquer ce que j ai fait comme modification
apparemment il y a une erreur de syntaxe dans cette partie
<input type="radio" onclick="majPrixPort(this.form); document.getElementById('submitAll').setAttribute('onClick', 'checkInputs("mondialRelay", "classMondialRelay")');" value="3" name="envoi" id="by_mondial relay">



j ai donc remplacer ce morceau de code
<input type="radio" onclick="majPrixPort(this.form);" value="3" name="envoi" id="by_mondial relay" >


par ceci mais il doit y avoir une erreur de syntaxe , car les couleurs dans notepad++ sont mauves


<input type="radio" onclick="majPrixPort(this.form); document.getElementById('submitAll').setAttribute('onClick', 'checkInputs("mondialRelay", "classMondialRelay")');" value="3" name="envoi" id="by_mondial relay">


puis j ai donc modifier ce morceau de code

<input type="submit" value="commander" name="sub"style="font-size:2.85em;background-color : red;color:white;">


par ceci

	<input type="submit" value="commander" name="sub" style="font-size:2.85em;background-color : red;color:white;" onClick="checkInputs('mondialRelay', 'classMondialRelay');" id="submitAll">



et ajouter ceci a la suite de mon code en javascript existant

<script>
function checkInputs(elementId, elementClass)
{
      var allInputs = document.getElementById(elementId).getElementsByTagName('input');

  for(var i = 0; i < allInputs.length; i++)
  {
     if(allInputs[i].className === elementClass && allInputs[i].value === '')
            alert("Un champs n'a pas été remplis"); // puis on bloque l'envoi du formulaire
  }
}
</script>


ensuite j ai modifie ceci
<TABLE bgcolor=#9FB9B5 width="690"BORDER>


par ceci

<table bgcolor="#9FB9B5" width="690" border="" id="mondialRelay">



mais je ne vois pas très bien ou je dois mettre ceci

class="classMondialRelay"



voici mon fameux formulaire degrossi au maximum sans les modifications
<?php
ini_set('display_errors', 1);
error_reporting(-1); 
?> 
<?php
date_default_timezone_set('Europe/Paris');
/*ton script doit etre sur un hebergeur qui supporte le php 5 de préférence*/
/*remplace mailbidon@free.fr entre les doubles guillemets*/
$tonemail="talonaiguille.be@gmail.com"; /**/
/*à toi de définir ta page de retour aprés envoi du mail*/
$site="https://www.canalblog.com/cf/login.cfm?error=blogprotected&bid=476894&mid=409438&returnTo=http%3A%2F%2Ftalonaiguille%2Ecanalblog%2Ecom%2F";
/*pas toucher*/
$headers = "From: <$tonemail>\n";
$headers .= "Reply-To: $tonemail\n";
$headers .= "MIME-version: 1.0\n";
$headers .= "Content-type: text/html; charset= iso-8859-1\n";
$message="";
$sujet = "Commande depuis mon site http://???"; /*si tu veux mettre quelque chose*/
if(isset($_POST['sub']) && $_POST['sub']==="commander") {
;
$message.="<hr>Le ".date('d-m-Y H:i:s')." par ip du client : ".$_SERVER['REMOTE_ADDR']."<hr>";
if(mail($tonemail,$sujet,$message,$headers)){
echo '
<td><center>
<a target="_blank" href="https://www.000webhost.com/migrate?static=true"><img width="85" height="85" alt="" src="https://www.000webhost.com/migrate?static=true"> </a></center>
</td>
<td>
<a href="https://www.000webhost.com/migrate?static=true" target="_blank"><font size="4"><font color = "ffffff">Passer une nouvelle commande </font ></font ></a>
</td>
 ';
/******* Vérification
foreach( $send as $value )
  echo $value . '<br />';
********/
    //$site="https://www.canalblog.com/cf/login.cfm?error=blogprotected&bid=476894&mid=409438&returnTo=http%3A%2F%2Ftalonaiguille%2Ecanalblog%2Ecom%2F"; /*à toi de définir ta page*/
   
   // echo '<br><center><b><h2>Pour revenir au site  <a href="'.$site.'" >ici</a></h2></b></center> ';
       
    exit;
    }else{
    echo 'PROBLEME FONCTION MAIL PHP';exit;
    }
}else{
}
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<head>
<!-- debut du code css de mon formulaire -->
<style type="text/css">

 body {
 background-color: #72ACDC;
 
 }

.divs { display   : none; }
a  { margin-right : 25px; }
class="classMondialRelay"

 </style>
 <!-- fin du code css de mon formulaire -->
<!--[if lte IE 6]>
 <style type="text/css">
  li {
   height: 1px;
   }
 </style>
 <![endif]-->
    <title>Formulaire</title>
 <!-- debut des liens vers les fichiers externe du formulaire -->
      <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>  
 <script src="https://www.000webhost.com/migrate?static=true"></script>
<link rel="stylesheet" type="text/css" href="https://www.000webhost.com/migrate?static=true" />
<link rel="stylesheet" href="https://www.000webhost.com/migrate?static=true" type="text/css" media="screen" >
<link rel="stylesheet" type="text/css" href="https://www.000webhost.com/migrate?static=true" />
 <link rel="stylesheet" type="text/css" href="https://www.000webhost.com/migrate?static=true" />  
 <!-- fin des liens vers les fichiers externe du formulaire -->
 <!-- debut du code en javascript de mon  formulaire -->
<script type="text/javascript">
function visibilite (id)
{
 var xx = document.getElementById("receveur").getElementsByTagName("div");

 for (var i=0; i<xx.length; i++)
  xx.item(i).style.display = "none";

 document.getElementById(id).style.display = "block";
}
</script>
 <!-- fin du code en javascript de mon  formulaire -->
   <META content="text/html; charset=windows-1252" http-equiv="Content-Type">
</head>
   <BODY background="Bon de commande JAVASCRIPT (Copyright Crash Computing 2011)_fichiers/index.htm" bgcolor="#008000">
 <CENTER>
 <table width="800" height="150" cellspacing="0" border="1">
 <tbody>
  <tr width="800"   ><form id="F_COMMANDE" action="https://www.000webhost.com/migrate?static=true" onSubmit="return Verifie(this)" method="post">
  </tr>
  <tr>
   <th width="800" height="23" bgcolor=#EBE0EF align="center" colspan="5"><font color="noir">Veuillez entrer vos coordonnées </font></th>
  </tr>
  <tr>
   <td width="250" height="24" bgcolor=#ffffff colspan="1"><font color="noir">Nom</font></td>
   <td width="550" height="24" bgcolor=#ffffff colspan="4"><input size="75" name="nom"></td>
  </tr>
  <tr>
   <td width="250" height="24" bgcolor=#ffffff colspan="1"><font color="noir">Prenom</font></td>
   <td width="550" height="24" bgcolor=#ffffff colspan="4"><input size="75" name="prenom"></td>
  </tr>
    <tr> <!-- debut du choix pour le pays de livraison -->
        <td width="250" height="24" bgcolor=#ffffff colspan="1"><font color="noir">Pays</font>
  <td width="550" height="24" bgcolor=#ffffff colspan="4">
  <form name="form" >
<select size="1"  onChange="location = this.options[this.selectedIndex].value;">
   <option selected="" value="0" "">                                 </option>
    <option value="javascript:visibilite('opt1');">Belgique</option>
 <option value="javascript:visibilite('opt2');" >France</option>
 <option value="javascript:visibilite('opt3');">Afghanistan</option>
</select>
 </td>
 </tr><!-- fin du choix pour le pays de livraison -->
  <tr ><!-- debut des frais de livraison -->
  <td width="800" height="49" bgcolor="#1A3665" align="center" colspan="5"><b> <font size="3"><font color = "ffffff">Pour le calcul des Frais de livraison choississez un pays:  </font></font></b></td> </tr>
  <tr ><td width="800" height="49" bgcolor="#1A3665" align="center" colspan="4">
  
  <div id="receveur">
  <div id="opt1" class="divs">
<span style="background-color: #F7DFFF;">Calculez les frais de livraison pour la belgique</span>
         <TABLE  bgcolor=#9FB9B5  width="690"BORDER>
    <TR width="690">
 <TD width="80" > <img src="https://www.000webhost.com/migrate?static=true envois/kiala.jpeg"width=75 height=75 > </TD>    
   <TD width="400" ><li><a ><label for="by_kiala"><input type="radio" onclick="majPrixPort(this.form);" value="1" name="envoi" id="by_kiala">Par kiala l envois est securisé et garanti</label></a></li></TD> 
    <TD width="210" > 
 <a target="_blank" href="https://www.ups.com/be/fr/Home.page"><img src="https://www.000webhost.com/migrate?static=true"width=200 height=62> </a> 
 </TD>  </TR>
  </TABLE>
  <TABLE bgcolor=#9FB9B5 width="690"BORDER>
 <TR width="690"></TR>
 <TR width="690"height="6">
 <TD width="345"><font color="noir">Nom du point kiala (ex librairie ...)</font></TD> 
  <TD width="345"> 
  <input size="45" name="non_du_point_kiala"><img align="absmiddle" id="adresse_ife_marker_3" src="chrome://informenter/skin/marker.png" class="ife_marker" style="border: 0pt none; width: 14px; height: 19px; cursor: pointer; display: inline;" title="La longueur du champ est inconnue">
  </TD> 
 </TR>
 <TR>
  <TD><font color="noir">Localite du point kiala</font></TD>
  <TD><input size="15" name="Localite_du_point_kiala"></TD> 
 </TR>
 <TR>
  <TD><font color="noir">Code postal du point kiala</font></TD> 
  <TD><input size="15" name="code_postal_du_point_kiala"><br></TD> 
 </TR>
 </TABLE>
    </div>
   <div id="opt2" class="divs">
   <span style="background-color: #F7DFFF;">Calculez les frais de livraison pour la france</span>
         <TABLE bgcolor=#9FB9B5 width="690"BORDER id="mondialRelay">>
    <TR width="690">
 <TD width="80" ><img src="https://www.000webhost.com/migrate?static=true envois/mondialrelay.jpeg"width=75 height=75 > </TD> 
  <TD width="400" ><li><a ><label for="by_mondial relay"><input type="radio" onclick="majPrixPort(this.form);" value="3" name="envoi" id="by_mondial relay" >Par mondial relay, l'envoi est sécurisé et garanti</label> </a></li></TD> 
   
  </TR>
  </TABLE>
    <TABLE bgcolor=#9FB9B5 width="690"BORDER>   
 <TR width="690">
   <TD width="390><font color="noir">Nom du point mondial relay (ex librairie ...)</font></TD> 
  <TD width="300"><input size="40" name="non_du_point_mondial_relay"> </TD> 
 </TR>
 <TR>
  <TD><font color="noir">Localite du point mondial relay</font></TD>
  <TD><input size="15" name="Localite_du_point_mondial_relay"></TD> 
 </TR>
 
  </TABLE>  
  </div>
  <div id="opt3" class="divs">
<span style="background-color: #F7DFFF;">Calculez les frais de livraison pour un autre pays</span>
  <TABLE bgcolor=#9FB9B5 width="690"BORDER>
 <TR width="690">
<Td width="690"><li><a target="_blank" href="https://www.000webhost.com/migrate?static=true"><b>Pour un autre pays envoyer moi un mail cliquez ici </b> </a>
     </li>
 </Td >
 </TR >
 </TABLE >
</div>
  </div></td>
  </td>
  <td width="110"height="69" bgcolor=#ffffff align="right" ><font size="3">€</font><input type="text" value="" size="7" name="prix_port">
  </td>
    </tr>
  </tbody>
          <input type="hidden" name="PoidsTotal">
    </table>
  <input type="submit" value="commander" name="sub"style="font-size:2.85em;background-color : red;color:white;">
     </form>
     </CENTER>
     </BODY>
   </HTML>
<!-- Hosting24 Analytics Code -->
<script type="text/javascript" src="http://stats.hosting24.com/count.php"></script>
<!-- End Of Analytics Code -->


0
BlackYoup Messages postés 181 Date d'inscription mardi 4 décembre 2012 Statut Membre Dernière intervention 10 juin 2014 20
Modifié par BlackYoup le 17/08/2013 à 01:19
Salut :)

De rien ;)

Allons-y pas à pas :

"il doit y avoir une erreur de syntaxe , car les couleurs dans notepad++ sont mauves"
Les " " qui contiennent les valeurs des paramètres de la fonctions doivent être échappés car sinon, on sort du onClick
Au passage, la fonction checkInputs est censée être éxécuté lors du click du submit et non du button radio, dans ce dernier cas, il sera normal que les champs seront vides puisque l'utilisateur ne les aura pas remplis

<input type="radio" onclick="majPrixPort(this.form); document.getElementById('submitAll').setAttribute('onClick', 'checkInputs(\'mondialRelay\', \'classMondialRelay\')');" value="3" name="envoi" id="by_mondial relay">


EDIT : après relecture, ce que j'ai écrit au dessus est juste ... useless, je me suis embrouillé. Ne pas en tenir compte, je le laisse pour la "trace"

"mais je ne vois pas très bien ou je dois mettre ceci
class="classMondialRelay

"
Il te faut les mettre sur tes inputs qui correspondent à ceux affichés lorsque l'on choisis mondialRelay. Il faudra que tu fasses de même pour ceux étant avec les autres services de livraison, par exemple :
<input size="15" name="Localite_du_point_mondial_relay" class="classMondialRelay">

Ca servira à ne traiter que les inputs liés au point de relais choisis

"// puis on bloque l'envoi du formulaire"
Au passage, la ou il y a ce commentaire, il te faudra bloquer l'envoi du formulaire sinon, malgré que l'utilisateur a été prévenu des champs manquant, le formulaire part quand même.

Voila, n'hésites pas à revenir pour la suite :)
0
flexi2202 Messages postés 3795 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 avril 2024 187
Modifié par flexi2202 le 17/08/2013 à 00:40
re
ben dis donc , super les explications , c est vraiment hyper gentil
a présent cela a l air de fonctionner mais
j ai un petit soucis lorsque le client ne remplit aucun champ dans mondial realy il reçoit bien le message
un champ n a pas été remplit
si il clic sur ok
le message réapparait et cela autant de fois qu il y a de champs et ensuite passe quand même sans remplir les champs
de plus je viens de m apercevoir que si il choisit kiala pour la Belgique et qu il remplit bien les champs pour kiala
l erreur s affiche aussi afin de l obliger a remplir les champs pour mondial relay
0
BlackYoup Messages postés 181 Date d'inscription mardi 4 décembre 2012 Statut Membre Dernière intervention 10 juin 2014 20
Modifié par BlackYoup le 17/08/2013 à 00:53
Oui, c'est ce que j'ai dit à la fin de mon précédent message

" "// puis on bloque l'envoi du formulaire"
Au passage, la ou il y a ce commentaire, il te faudra bloquer l'envoi du formulaire sinon, malgré que l'utilisateur a été prévenu des champs manquant, le formulaire part quand même. "

J'ai trouvé une solution, mais qui va te demander une ou 2 modifications. Tous tes inputs et tes différents boutons ne sont même pas dans un <form> il me semble ! Tu va devoir en mettre un et l'adapter :

Voila comment : https://forums.commentcamarche.net/forum/affich-2262446-php-javascript-interdire-l-envoi-d-un-form

Nous notre fonction s'apelle checkInputs(), et accepte 2 paramètres. Il va donc falloir changer son emplacement (du boutton submit au form) et donc, changer aussi la fonction qui lui donne son attribut !

Change cette ligne :
document.getElementById('submitAll').setAttribute('onClick', 'checkInputs("mondialRelay", "classMondialRelay")');

par celle la :
document.getElementsByTagName('form')[0].setAttribute('onsubmit', 'return checkInputs("mondialRelay", "classMondialRelay")

Explication : Normalement tu ne dois avoir qu'un <form> dans ta page. On récupère donc tous les form et on choisis le 1er ( [0] ) auquel l'on ajoute l'attribut onsubmit

Il va aussi falloir modifier la fonction checkInput pour qu'elle renvoi un "false" qui stoppera l'envoi du formulaire :
function checkInputs(elementId, elementClass) {
var allInputs = document.getElementById(elementId).getElementsByTagName('input');

  for(var i = 0; i < allInputs.length; i++) {
     if(allInputs[i].className === elementClass && allInputs[i].value === '') {
            alert("Un champs n'a pas été remplis");
             return false;
             break;
     }
  }
}

Voila, je pense que ca doit être bon :)
0
flexi2202 Messages postés 3795 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 avril 2024 187
17 août 2013 à 01:07
Ben dis donc tu es vraiment un as de la programmation , incroyable
a ce demander comment tu t y retrouves
mdrrr

Mais c est génial et merci pour ce temps consacrer et les explications
Mais malheureusement cela ne fonctionne pas

lorsque le client oublies tous les champs il y a bien un message en dissant qu il a oublie un champ
mais des qu il clic sur ok , le formulaire reste en attende puis passe quand meme

voici ce que j ai modifie
ancien morceau de coe

<input type="radio" onclick="majPrixPort(this.form); document.getElementById('submitAll').setAttribute('onClick', 'checkInputs(\'mondialRelay\', \'classMondialRelay\')');" value="3" name="envoi" id="by_mondial relay">


nouveau

<input type="radio" onclick="majPrixPort(this.form); document.getElementsByTagName('form')[0].setAttribute('onsubmit', 'return checkInputs("mondialRelay", "classMondialRelay")" value="3" name="envoi" id="by_mondial relay">


et le deuxième avant les modifications
<script type="text/javascript">
function checkInputs(elementId, elementClass)
{
      var allInputs = document.getElementById(elementId).getElementsByTagName('input');

  for(var i = 0; i < allInputs.length; i++)
  {
     if(allInputs[i].className === elementClass && allInputs[i].value === '')
            alert("Un champs n'a pas été remplis"); // puis on bloque l'envoi du formulaire
  }
}
</script>


et donc modifie

<script type="text/javascript">
function checkInputs(elementId, elementClass) {
var allInputs = document.getElementById(elementId).getElementsByTagName('input');

for(var i = 0; i < allInputs.length; i++) {
if(allInputs[i].className === elementClass && allInputs[i].value === '') {
alert("Un champs n'a pas été remplis");
return false;
break;
}
}
} 
</script>
0
BlackYoup Messages postés 181 Date d'inscription mardi 4 décembre 2012 Statut Membre Dernière intervention 10 juin 2014 20
Modifié par BlackYoup le 17/08/2013 à 01:27
Tu te dois de créer un <form></form> dans lequel toute tes tables / input se trouverons, l'a tu fais ?

Ensuite :
<input type="radio" onclick="majPrixPort(this.form); document.getElementsByTagName('form')[0].setAttribute('onsubmit', 'return checkInputs("mondialRelay", "classMondialRelay")" value="3" name="envoi" id="by_mondial relay">

Erreur de ma part

<input type="radio" onclick="majPrixPort(this.form); document.getElementsByTagName('form')[0].setAttribute('onsubmit', 'return checkInputs(\'mondialRelay\', \'classMondialRelay\')')" value="3" name="envoi" id="by_mondial relay" >

Ca sera mieux

Sinon, si tu es sous firefox, presse les boutons ctrl+shift+k afin d'afficher une console de debug pour le javascript et colle les erreurs ici. Si tu es sous chrome : clique droit => inspecter l'élément. Si des erreurs surviennent, un triangle rouge s'affichera en bas à droite
0
flexi2202 Messages postés 3795 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 avril 2024 187
Modifié par flexi2202 le 17/08/2013 à 01:27
je viens de lire le lien que tu m as donne

je dois refaire un nouveau code en javascript avec ceci dedans


<script language="javascript">
function recupere_info ()
{
if(document.form1.nom.value == "" || document.form1.prenom.value == "")
{
alert ("Veuillez renseigner tous les champs s'il vous plaît!");
return false;
}
return true;
}
</script> 


et modifier ceci

<form id="F_COMMANDE" action="https://www.000webhost.com/migrate?static=true" onSubmit="return Verifie(this)" method="post">


avec l aide de ceci

<form id="form1" name="form1" method="post" action="?" onsubmit=" return (recupere_info());">



ES CE BIEN CELA
un tout grand merci pour l aide
0
BlackYoup Messages postés 181 Date d'inscription mardi 4 décembre 2012 Statut Membre Dernière intervention 10 juin 2014 20
Modifié par BlackYoup le 17/08/2013 à 01:31
Nan pas spécialement. Je t'ai donné ce lien pour que tu voit comment ca marche. Ensuite, je te l'ai adapté dans ce post : https://forums.commentcamarche.net/forum/affich-28501700-pourquoi-ma-condition-ne-fonctionne-pas#9

EDIT : de plus, le lien au dessus ne prend pas au charge autant d'inputs que nous. Dans notre cas le parcours de tous les inputs sera plus simple à écrire que de les rajouter à la main un à un, mais l'idée est la
0
flexi2202 Messages postés 3795 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 avril 2024 187
17 août 2013 à 01:39
ah ok , d accord ben encore merci pour tout ce temps consacre
je viens donc de lancer mon formulaire et la console sous firefox

voici donc les erreurs

[01:36:40,446] La propriété non standard « document.all » a été utilisée. Veuillez utiliser la propriété standard du W3C « document.getElementById() » à la place. @ file:///C:/Documents%20and%20Settings/azer/Bureau/essai10perlecommande270613NV1.html:330
[01:36:41,911] La déclaration d'encodage de caractères du document HTML du cadre n'a pas été trouvée lors de l'analyse des 1024 premiers octets du fichier. S'il est affiché dans un navigateur configuré différemment, cette page sera automatiquement rechargée. La déclaration d'encodage de caractères doit être déplacée dans les 1024 premiers octets du fichier. @ file:///C:/Documents%20and%20Settings/azer/Bureau/essai10perlecommande270613NV1.html:873
[01:36:42,620] ReferenceError: $$ is not defined @ https://www.000webhost.com/migrate?static=true
0
BlackYoup Messages postés 181 Date d'inscription mardi 4 décembre 2012 Statut Membre Dernière intervention 10 juin 2014 20
17 août 2013 à 01:41
Rien de bien méchant, et le formulaire ne bloque toujours pas ?
0
flexi2202 Messages postés 3795 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 avril 2024 187
17 août 2013 à 01:43
je viens a présent de lancer le formulaire mais cela ne fonctionne toujours pas
en fait il me dit bien que les champs ne sont pas complètes mais lorsque je clic sur ok il passe de champ en champ et termine avec cette phrase
"empêcher cette page d ouvrir des dialogues supplémentaires"
pour ensuite passer la commande sans les infos de mondial relay
0
BlackYoup Messages postés 181 Date d'inscription mardi 4 décembre 2012 Statut Membre Dernière intervention 10 juin 2014 20
17 août 2013 à 01:50
Bizarre, au passage, je viens de voir que les champs nom prénom etc.. nécéssitent d'être remplis sinon le formulaire ne s'envoit pas. C'est toi qui a fait ca ? ca pourrait répondre au besoin
0
flexi2202 Messages postés 3795 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 avril 2024 187
Modifié par flexi2202 le 17/08/2013 à 01:52
oui c est moi qui avait demande cela a un autre membre au début de la construction du formulaire
0
flexi2202 Messages postés 3795 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 avril 2024 187
17 août 2013 à 01:45
non il bloque toujours pas
0
flexi2202 Messages postés 3795 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 avril 2024 187
Modifié par flexi2202 le 17/08/2013 à 01:49
Tu te dois de créer un <form></form> dans lequel toute tes tables / input se trouverons, l'a tu fais ?

je n ai pas très bien compris cette partie ?

en fait j ai bien ceci
<form id="F_COMMANDE" action="https://www.000webhost.com/migrate?static=true" onSubmit="return Verifie(this)" method="post">

et la fin de mon formulaire ceci

</form>

donc tout le formulaire est a l interieur
0
BlackYoup Messages postés 181 Date d'inscription mardi 4 décembre 2012 Statut Membre Dernière intervention 10 juin 2014 20
17 août 2013 à 01:53
Ce n'est pas la fonction verifie() qu'il faut mettre même si j'imagine qu'elle est écrasée par notre script après. Autant que tu ne mettes pas de onsubmit sur le form par défaut. Le click sur le bouton radio le rajoutera
0
flexi2202 Messages postés 3795 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 avril 2024 187
17 août 2013 à 01:55
merci pour l aide

donc je mets ceci a al place

<form id="F_COMMANDE" action="https://www.000webhost.com/migrate?static=true" method="post">
0
BlackYoup Messages postés 181 Date d'inscription mardi 4 décembre 2012 Statut Membre Dernière intervention 10 juin 2014 20
17 août 2013 à 01:56
Voila, je cherche comment les messages apparaissent pour les autres champs
0
flexi2202 Messages postés 3795 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 avril 2024 187
Modifié par flexi2202 le 17/08/2013 à 01:59
je viens de faire l essai avec cette modification c est toujours la même chose le formulaire ne bloque pas

donc chose bizarre sur mondial relay j ai 4 camps et j ai 6 messages d erreur
en me disant qu un champ n es pas rempli et deux messages d erreur avec ceci
"empêcher cette page d ouvrir des dialogues supplémentaires"
0
BlackYoup Messages postés 181 Date d'inscription mardi 4 décembre 2012 Statut Membre Dernière intervention 10 juin 2014 20
Modifié par BlackYoup le 17/08/2013 à 02:15
mmh au final, celui qui t'a aidé à repris le même tuto que je t'ai passé car les fonctions et la methode est la même. Et ce que nous faisons ne marche pas puisque il y avait déja un form qui englobais le tout, mais dans un <td> ce qui n'est pas commun.

Ce qui serait donc possible c'est que tu remettes ce que tu viens d'enlever du form et que tu trouves cette fonction javascript : Verifie(aBC)

Ensuite, tu va à la fin, et tu continues à la suite les elseif()
else if(aBC.email.value == "")

En remplacant le 2e paramètre (en l'occurence la, .email) par l'attribut "name" de ton input, et tu en fait autant que tu as d'input à vérifier

Désolé de ne pas l'avoir vu avant. Ce script est extrêmement répétitif et lourd. Il y a moyen de le réduire via la fonction qu'on a faite (en la changeant) mais la, impossible d'intégrer ce que l'on a fait dedans. Si tu es d'attaque, fais le moi savoir.

Si tu choisis de copier/coller les else if, tu peux retirer ce code :
document.getElementsByTagName('form')[0].setAttribute('onsubmit', 'return checkInputs(\'mondialRelay\', \'classMondialRelay\')')"
du bouton radio

Encore désolé, c'est un vrai bordel la dedans, j'aurais du mieux regarder :)
0
flexi2202 Messages postés 3795 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 avril 2024 187
Modifié par flexi2202 le 17/08/2013 à 02:23
Merci pour l aide et le dévouement
en fait j ai essayé de faire au début de mes tests a de mettre des

else if(aBC
a la suite des autres

mais cela n a pas fonctionner non plus et pour cause si le client choisit mondial relay , il doit remplir aussi les champs de kiala
et vice versa

j avais donc fait ceci

else if(aBC.non_du_point_mondial_relay.value == ""){
alert('Vous n\'avez pas renseign\351 votre point mondialrelay.');
return false;
}

ect ...

Mais sans succès
0
BlackYoup Messages postés 181 Date d'inscription mardi 4 décembre 2012 Statut Membre Dernière intervention 10 juin 2014 20
17 août 2013 à 02:26
Oui je vois, il fallait que la donnée puisse être changeable. Dans ce cas, la fonction avec laquelle nous étions partit était la bonne solution. Elle sera au passage facilement adaptable. De plus, je vois que jquery est présent, on pourra l'utiliser pour optimiser le tout.

Comme vous voulez ;)
0
flexi2202 Messages postés 3795 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 avril 2024 187
17 août 2013 à 02:32
Pour ma part la méthode que vous jugez la plus facile sera la meilleur
oui jquery est bien présent
Mais pour ce soir je vais arretter de vous embêter , vous remercier vraiment du fond du coeur pour tout ce boulot et tout ce temps que vous me consacrez
et vous dit donc a bientôt

Bonne fin de nuit

et encore mille fois merci
0
BlackYoup Messages postés 181 Date d'inscription mardi 4 décembre 2012 Statut Membre Dernière intervention 10 juin 2014 20
17 août 2013 à 02:35
Il n'y a pas de quoi, je me casse actuellement la tête avec du javascript aussi :)
Bonne nuit à vous aussi
0
flexi2202 Messages postés 3795 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 avril 2024 187
17 août 2013 à 02:37
J attend donc de votre part une nouvelle proposition pour achever ce formulaire quand le temps vous le permettra

bon courage pour le javascript

et encore mille fois merci
0
BlackYoup Messages postés 181 Date d'inscription mardi 4 décembre 2012 Statut Membre Dernière intervention 10 juin 2014 20
17 août 2013 à 13:00
Erf, je viens d'écrire une réponse en 15 minutes qui n'a pas été postée ._.

Reprenons :)

J'ai donc modifié ce dont vous aviez besoin je pense.
Avant tout, personnellement, je déplacerais le <form> en dehors de la balise TD, je le mettrais avant la balise <center> pour plus de lisibilité. Au cas ou, revoici la ligne qui n'a pas changé :
<form id="F_COMMANDE" action="https://www.000webhost.com/migrate?static=true" onSubmit="return Verifie(this)" method="post">


Commençons par les coordonnées :
J'ai donc optimisé le script en utilisant jquery. Pour éviter à chaque fois de réécrire le else if(), j'ai du ajouté une class aux inputs des coordonnées : class="infos"
<input size="75" name="nom" class="infos">

Il faudra rajouter cette class à tous les champs qui ne bougeront pas, c'est à dire ceux qui seront toujours à remplir quoi qu'il arrive.

Ensuite, je suis repartit sur la même idée qu'hier avec des class sur les input des différents livreurs. En l'occurence, j'ai encore utilisé Mondial Relay et mes exemple reposeront dessus. Il faudra adapter ce qui suit à chacun de vos livreurs :)

Voila donc pour les inputs :
<input size="40" name="non_du_point_mondial_relay" class="classMondialRelay">


Ensuite, on s'occupe de l'événement onClick du bouton radio lorsque l'on sélectionne le livreur. Celui ci va se charger lors du click de définir un argument pour la fonction Verifie() dans le <form>. La encore, pour Mondial Relay
onclick="majPrixPort(this.form); document.getElementById('F_COMMANDE').setAttribute('onsubmit', 'return Verifie(this, \'classMondialRelay\')');"

Vous remarquerez que le 2e argument est le nom de la class attribuée aux inputs du livreur.

Une fois fait, il ne reste plus que la fonction Verifie()
function Verifie(aBC, className)
{        
     var returnStatus = null;
     $('.infos').each(function(){
         if(this.value === ''){
             alert('Vous n\'avez pas renseign\351 votre '+this.name);
             returnStatus = false;
             return false;}
     });

     var regMail = new RegExp('^[a-z0-9]+([_|\.|-]{1}[a-z0-9]+)*@[a-z0-9]+([_|\.|-]{1}[a-z0-9]+)*[\.]{1}[a-z]{2,6}$', 'i');
     // var regCP = /^[0-9]{4}$/; //Vérif code postal benelux
     if(returnStatus !== false && regMail.test(aBC.email.value))
         returnStatus = true;
     else{
         alert('Vous devez renseign\351 une adresse e-mail corecte.');
         returnStatus = false;}

     if(returnStatus !== false && typeof(className) === 'undefined'){
        alert('Vous avez oubli\351 de choisir un moyen de livraison');
        returnStatus = false;}
     else if(returnStatus !== false){
         $('.'+className).each(function(){
             if(this.value === ''){
                 alert('Vous n\'avez pas renseign\351 un champs de livraison : '+ this.name.replace(/_/g, ' '));
                 returnStatus = false;
                 return false;
             }
         });
     }
     /*if(regCP.test(aBC.email.value)) ///////////Verif Code Postal Benelux
     {
         return true;
     }else
     {
         alert('Vous devez renseign\351 un Code postal correct !');
         document.ex.cp.focus();
         return false;
      }*/
     return returnStatus;
   }


Pour plus de lisibilité, un pastebin : https://pastebin.com/sbYTTmGV

Si un champs n'est pas remplis, la fonction se charge d'afficher un message ainsi que le nom de l'input concerné vu que ceux-ci sont plutôt éloquent.

J'attend votre retour :)
0
flexi2202 Messages postés 3795 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 avril 2024 187
17 août 2013 à 14:44
Bonjour Black youp

Un tout grand merci pour ce nouveau code et ce nouveau cassage de tête

on progresse le formulaire refuse de s envoyer ...

j explique donc les modifications apportées

j ai remplace ceci


<input type="radio" onclick="majPrixPort(this.form); document.getElementById('F_COMMANDE').setAttribute('onsubmit', 'return Verifie(this, \'classMondialRelay\')');" value="3" name="envoi" id="by_mondial relay" >

par ceci

<input type="radio" onclick="majPrixPort(this.form); document.getElementById('F_COMMANDE').setAttribute('onsubmit', 'return Verifie(this, \'classMondialRelay\')');" value="3" name="envoi" id="by_mondial relay" >

par ceci

<input type="radio" onclick="majPrixPort(this.form); document.getElementById('F_COMMANDE').setAttribute('onsubmit', 'return Verifie(this, \'classMondialRelay\')');" value="3" name="envoi" id="by_mondial relay" >

ensuite

puis remplace ceci

<input size="40" name="non_du_point_mondial_relay" >


par ceci
<input size="40" name="non_du_point_mondial_relay" class="classMondialRelay">


et pour finir


j ai remplace ceci
    function Verifie(aBC)
   {
   if(aBC.nom.value == ""){
        alert('Vous n\'avez pas renseign\351 votre nom.');
        return false;
   }else if(aBC.prenom.value == ""){
        alert('Vous n\'avez pas renseign\351 votre prenom.'); 
        return false;
   }else if(aBC.adresse.value == ""){
        alert('Vous n\'avez pas renseign\351 votre adresse,N°.'); 
        return false;
   }else if(aBC.code_postal.value == ""){
        alert('Vous n\'avez pas renseign\351 votre code postal.'); 	
        return false;
   }else if(aBC.ville.value == ""){
        alert('Vous n\'avez pas renseign\351 votre ville .'); 	
        return false;
   }else if(aBC.telephone.value == ""){
        alert('Vous n\'avez pas renseign\351 votre numero de telephone .'); 		
        return false;
   }else if(aBC.pays.value == ""){
        alert('Vous n\'avez pas renseign\351 votre pays.');
        return false;
   }else if(aBC.email.value == ""){
        alert('Vous n\'avez pas renseign\351 votre email.'); return false;
   }  else{
     var regMail = new RegExp('^[a-z0-9]+([_|\.|-]{1}[a-z0-9]+)*@[a-z0-9]+([_|\.|-]{1}[a-z0-9]+)*[\.]{1}[a-z]{2,6}$', 'i');
     // var regCP = /^[0-9]{4}$/; //Vérif code postal benelux
     if(regMail.test(aBC.email.value))
	 {
		return true;
	 }else
	 {
        alert('Vous devez renseign\351 une adresse e-mail corecte.');
		return false;
	 }

     /*if(regCP.test(aBC.email.value)) ///////////Verif Code Postal Benelux
    {
        return true;
    }else
    {
        alert('Vous devez renseign\351 un Code postal correct !');
        document.ex.cp.focus();
        return false;
    }*/
   }
     }
	 



par ceci

function Verifie(aBC, className)
{        
     var returnStatus = null;
     $('.infos').each(function(){
         if(this.value === ''){
             alert('Vous n\'avez pas renseign\351 votre '+this.name);
             returnStatus = false;
             return false;}
     });

     var regMail = new RegExp('^[a-z0-9]+([_|\.|-]{1}[a-z0-9]+)*@[a-z0-9]+([_|\.|-]{1}[a-z0-9]+)*[\.]{1}[a-z]{2,6}$', 'i');
     // var regCP = /^[0-9]{4}$/; //Vérif code postal benelux
     if(returnStatus !== false && regMail.test(aBC.email.value))
         returnStatus = true;
     else{
         alert('Vous devez renseign\351 une adresse e-mail corecte.');
         returnStatus = false;}

     if(returnStatus !== false && typeof(className) === 'undefined'){
        alert('Vous avez oubli\351 de choisir un moyen de livraison');
        returnStatus = false;}
     else if(returnStatus !== false){
         $('.'+className).each(function(){
             if(this.value === ''){
                 alert('Vous n\'avez pas renseign\351 un champs de livraison : '+ this.name.replace(/_/g, ' '));
                 returnStatus = false;
                 return false;
             }
         });
     }
     /*if(regCP.test(aBC.email.value)) ///////////Verif Code Postal Benelux
     {
         return true;
     }else
     {
         alert('Vous devez renseign\351 un Code postal correct !');
         document.ex.cp.focus();
         return false;
      }*/
     return returnStatus;
   }


j ai aussi modifie tous les champs obligatoires par ceci
<input size="75" name="nom" class="infos">


Alors résultat
si je fais un essai sans remplir aucun champ de mondial relay j ai ce message qui apparait 4 fois et dont je saute en cliquant sur ok
"un champ n a pas ete remplis"
ensuite un message avec
"vous n avez pas renseigne un champs de livraison : nom du point mondial relay"
ensuite on reste bloquer sur la page du formulaire

donc apparemment il y aurait
ce message qui apparait 4 fois et dont je saute en cliquant sur ok
"un champ n a pas été remplis" qui serait de trop

un mega gros merci pour l aide
0
BlackYoup Messages postés 181 Date d'inscription mardi 4 décembre 2012 Statut Membre Dernière intervention 10 juin 2014 20
17 août 2013 à 14:58
Je ne vois pas d'ou viendrait "un champ n a pas ete remplis", je ne le trouve nulle part dans le code source. Avez vous bien enlevé la fonction checkInputs() ?
0