Ajout de test en javascript avant l'envoi

Fermé
mb42 Messages postés 432 Date d'inscription vendredi 17 octobre 2008 Statut Membre Dernière intervention 14 janvier 2014 - 23 mai 2010 à 00:39
Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 - 25 mai 2010 à 14:04
Bonjour,




j'ai un probleme concerne une fonction javascript

je veux expliquer en detail

voila quatre fichier famille.php

contient :

<html>
<head>
<title>Tutoriel Ajax (XHTML + JavaScript + XML)</title>

<script type='text/javascript'>

function getXhr(){
var xhr = null;
if(window.XMLHttpRequest) // Firefox et autres
xhr = new XMLHttpRequest();
else if(window.ActiveXObject){ // Internet Explorer
try {
xhr = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
}
else { // XMLHttpRequest non supporté par le navigateur
alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
xhr = false;
}
return xhr;
}

/**
* Méthode qui sera appelée sur le click du bouton
*/
function go(){
var xhr = getXhr();
// On défini ce qu'on va faire quand on aura la réponse
xhr.onreadystatechange = function(){
// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
if(xhr.readyState == 4 && xhr.status == 200){
leselect = xhr.responseText;
// On se sert de innerHTML pour rajouter les options a la liste
document.getElementById('article').innerHTML = leselect;
}
}

// Ici on va voir comment faire du post
xhr.open("POST","ajaxarticle.php",true);
// ne pas oublier ça pour le post
xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
// ne pas oublier de poster les arguments
// ici, l'id de l'auteur
sel = document.getElementById('famille');
idauteur = sel.options[sel.selectedIndex].value;
xhr.send("idfamille="+idauteur);
}




</script>
</head>
<body>
<form action="suivre.php" method="post" name="form1">


<table frame="box" rules="none">
<tr>
<td colspan="2" align="left"><div align="center">Veuillez remplir les champs</div></td>
</tr>

<tr>
<tr><td>Famille</td>
<td><select name='famille' id='famille' onchange='go()'>
<option value='-1'>Aucun</option>

<?php

include('modele.php');
$result=retourfamille();
while($ligne=mysql_fetch_row($result))
{
echo"<option value=\"$ligne[0]\">$ligne[1]</option>";
}


?>

</select>
</td>
</tr>
<tr><td>article</td>
<td>
<div id='article' style='display:inline'>
<select name='article' id="article1">
<option value='-1'>Choisir une famille</option>
</select>
</div>

</td>
</tr>

<tr>
<td>
quantite</td>
<td>
<input type="text" name="quantite" value=""/></td>
</tr>
<tr>
<td colspan="2">

<input type="submit" value="enregister" name="envoyer"/>


</form>
</body>
</html>

le fichier ajaxarticle.php contient :
<?php
echo "<select name='article'>";
if(isset($_POST["idfamille"])){
$serveur="localhost";
$user="user1";
$pwd="user1";
$db="glpi";
$lien=mysql_connect($serveur,$user,$pwd) or die("impossible de connecter de serveur");
mysql_select_db($db,$lien);

$query="select *from article where famille=".$_POST["idfamille"]."";
$res=mysql_query($query);
while($ligne=mysql_fetch_row($res))
{


echo"<option value=\"$ligne[0]\">$ligne[1]</option>";


}


le fichier modele.php continet <?php




function retourfamille()
{
$serveur="localhost";
$user="user1";
$pwd="user1";
$db="glpi";
$lien=mysql_connect($serveur,$user,$pwd) or die("impossible de connecter de serveur");
mysql_select_db($db,$lien);
$query="select *from famille";
$res=mysql_query($query);

return $res;
}


function decrementearticle($article,$quantite)
{
$serveur="localhost";
$user="user1";
$pwd="user1";
$db="glpi";
$lien=mysql_connect($serveur,$user,$pwd) or die("impossible de connecter de serveur");
mysql_select_db($db,$lien);
$query="update article set qtestock=qtestock-'$quantite' where Reference ='$article'";
mysql_query($query);
}
?>/CODE

le fichier suivre.php contient [CODE]<?php
include('modele.php');
$article=$_POST['article'];
$quantite=$_POST['quantite'];
decrementearticle($article,$quantite);
header('Location:famille.php');





?>



ces quatre fichier traites les listes deroulante avec ajax et aussi fait decremente de quantite suite a l'excution de script

tout est excuter avec succe

mon but c simple c'est d'jouter une fonction javascript qui permet de tester

si la quantite entrer lors de l'emprunte c'est a dire dans le script

famille.php est superieur a la valeur de la quantite qui existe dans la base de donne dans la table article

la modification doit toucher seulement le script famille.php

mais mois j'envois les quatres fichier pour vous expliquer le principe

avec tous les notion (nom de la base ,table, les attributs que je voulé toucher)

donc il faux ajouter une fonction javascript qui prend en parametre

la quantite saisie (dans le script famille.php) et un autre

parametre qui est la qauntite de stock qui se trouve dans la base de donne

dans la table article qui fait reference a l'article selectionne( puisque

l'article selectionne correspond a la reference : voir ajaxarticle.php)

si la quantite saisie est superieur a la qantite qui existe dans la base

de donne afficher une alerte si non dirriger ver la page suivre.php

(qui je suppose avec document.form1.submit())

voila tous le probleme (c'est juste ajouter un message d'alerte avant de derriger ver la page suivre.php)

la modification touche

<input type="submit" value="enregister" name="envoyer"

onClick="test( <?php ....//avec if(isset(_POSTE[ ] ?> ..... )"/>

et avec biensur l'ajout de fonction javascript function test()............



pouvez m'aidez c urgent
A voir également:

10 réponses

mb42 Messages postés 432 Date d'inscription vendredi 17 octobre 2008 Statut Membre Dernière intervention 14 janvier 2014 7
23 mai 2010 à 15:02
pour simplifier les choses

comment recuperer la valeur de l'article( c'est apres selection de l'article cette

valeur correspond a la reference de l'article) et a partic du qu'el consulter dans

la base de donne la quantite qui correspond a la reference de l'article)

passer cette valeur a la fonction javascript avec autre paramete qui est la

quantite saisie dans le formulaire de la meme page

si les deux valeurs sont recuperer at donner comme parametre a la

fonction javascript le reste est simple

dans le corp de la fonction comparer les deux valeur

avec le principe qui je deja donne
0
Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
23 mai 2010 à 21:37
tu cree une autre fonction ajax dans le même esprit que go()

tu la nommes verif_qantite()

mais dans cette partie tu mets:
// Ici on va voir comment faire du post
xhr.open("POST","ajax_quantite_article.php",true);
// ne pas oublier ça pour le post
xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
// ne pas oublier de poster les arguments
// ici, l'id de l'auteur
sel = document.getElementById('famille');
idauteur = sel.value;
sel2=document.getElementById('article');
idarticle=sel2.value;
xhr.send("idfamille="+idauteur+"&idarticle=+idarticle);


tu cree un autre fichier ajax_quantite_article.php


qui va récuperer en POST les deux idfalmille et article

et lire dans la BDD la quantite correspondante

et renvoyer cette valeur à Ajax

dans la partie
if(xhr.readyState == 4 && xhr.status == 200){
leselect = xhr.responseText;
// On se sert de innerHTML pour rajouter les options a la liste
document.getElementById('article1').innerHTML = leselect;
}


tu mets quantite_dispo=xhr.responseText;
tu lis la quantité saisie dans l'input correspondant par q_saisie=document.getElementById('quantite').value;

et tu compares

if (q_saisie>quantite_dispo ){
   alert("Quantité supérieure à la disponible !");
   return false; //ça va empecher le formulaire d'être envoyé
}else{
   return true; //autorise l'envoi du formulaire
}



il faut aussi modifier le formulaire:

<form action="suivre.php" method="post" name="form1" onSubmit="return verif_quantite;">


........

<input type="text" name="quantite" id="quantite" value=""/>



ainsi le formulaire ne sera envoyé au script suivre.php que si la fonction a retourné true
0
mb42 Messages postés 432 Date d'inscription vendredi 17 octobre 2008 Statut Membre Dernière intervention 14 janvier 2014 7
24 mai 2010 à 00:11
je suivre vous etapes

mais quant je met une valeur saisie superieur a la valeur qui existe

dans la BDD il decremente la quantite qui est faut (normalement il m'affiche le message qui est écrit en javascript)

peut etre le fichier ajax_quantite_article.php necessite encore de modification

voila ce fichier (ajax_quantite_article.php )

<?php

if(isset($_POST["idarticle"])){
$serveur="localhost";
$user="user1";
$pwd="user1";
$db="glpi";
$lien=mysql_connect($serveur,$user,$pwd) or die("impossible de connecter de serveur");
mysql_select_db($db,$lien);


$query1="select qtestock from article where Reference=".$_POST["idarticle"]."";
$res1=mysql_query($query1);

echo"$res1";



}



?>



le fichier famille.php


<html>
<head>
<title>Tutoriel Ajax (XHTML + JavaScript + XML)</title>

<script type='text/javascript'>

function getXhr(){
var xhr = null;
if(window.XMLHttpRequest) // Firefox et autres
xhr = new XMLHttpRequest();
else if(window.ActiveXObject){ // Internet Explorer
try {
xhr = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
}
else { // XMLHttpRequest non supporté par le navigateur
alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
xhr = false;
}
return xhr;
}

/**
* Méthode qui sera appelée sur le click du bouton
*/
function go(){
var xhr = getXhr();
// On défini ce qu'on va faire quand on aura la réponse
xhr.onreadystatechange = function(){
// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
if(xhr.readyState == 4 && xhr.status == 200){
leselect = xhr.responseText;
// On se sert de innerHTML pour rajouter les options a la liste
document.getElementById('article').innerHTML = leselect;
}
}

// Ici on va voir comment faire du post
xhr.open("POST","ajaxarticle.php",true);
// ne pas oublier ça pour le post
xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
// ne pas oublier de poster les arguments
// ici, l'id de l'auteur
sel = document.getElementById('famille');
idauteur = sel.options[sel.selectedIndex].value;
xhr.send("idfamille="+idauteur);
}




function verif_qantite() {
var xhr = getXhr();
// On défini ce qu'on va faire quand on aura la réponse
xhr.onreadystatechange = function(){
// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
if(xhr.readyState == 4 && xhr.status == 200){
quantite_dispo=xhr.responseText;
q_saisie=document.getElementById('quantite').value;
if (q_saisie>quantite_dispo ){
alert("Quantité supérieure à la disponible !");
return false; //ça va empecher le formulaire d'être envoyé
}else{
return true; //autorise l'envoi du formulaire
}
}
}

xhr.open("POST","ajax_quantite_article.php",true);
// ne pas oublier ça pour le post
xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
// ne pas oublier de poster les arguments
// ici, l'id de l'auteur
sel = document.getElementById('famille');
idauteur = sel.value;
sel2=document.getElementById('article');
idarticle=sel2.value;
xhr.send("idfamille="+idauteur+"&idarticle="+idarticle);

}






</script>
</head>
<body>
<form action="suivre.php" method="post" name="form1" onSubmit="return verif_quantite;">




<table frame="box" rules="none">
<tr>
<td colspan="2" align="left"><div align="center">Veuillez remplir les champs</div></td>
</tr>

<tr>
<tr><td>Famille</td>
<td><select name='famille' id='famille' onchange='go()'>
<option value='-1'>Aucun</option>

<?php

include('modele.php');
$result=retourfamille();
while($ligne=mysql_fetch_row($result))
{
echo"<option value=\"$ligne[0]\">$ligne[1]</option>";
}


?>

</select>
</td>
</tr>
<tr><td>article</td>
<td>
<div id='article' style='display:inline'>
<select name='article' id="article1">
<option value='-1'>Choisir une famille</option>
</select>
</div>

</td>
</tr>

<tr>
<td>
quantite</td>
<td>
<input type="text" name="quantite" id="quantite" value=""/>

</td>
</tr>
<tr>
<td colspan="2">

<input type="submit" value="enregister" name="envoyer"/>


</form>
</body>
</html


avec les autres fichier qui ne subissent aucune modification

(suivre.php) et modele.php et ajaxarticle.php


il manque c'est sur une astuce simple peut etre la recuperation

de quantite de la BDD dans ajax_quantite_article.php j'utilise

seulement le idarticle


pouvez m'aidez C URGENT


merci d'avance
0
Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
24 mai 2010 à 13:12
tu as une erreur de principe dans la recuperatrion de la quantité dans ajax_quantite_article.php:
$query1="select qtestock from article where Reference=".$_POST["idarticle"]."";
$res1=mysql_query($query1);


il faut "extraire" le résultat renvoyé par la ressource mysql_query

$row=mysql_fetch_assoc($res1);
$quantite=$row['qtestock'];
//et la tu fais

echo $quantite;
0

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

Posez votre question
mb42 Messages postés 432 Date d'inscription vendredi 17 octobre 2008 Statut Membre Dernière intervention 14 janvier 2014 7
24 mai 2010 à 21:13
CA marche il fait le test mais le probleme il n'affiche pas le message

d'alerte en cas ou la quantité saisi est supérieur a la quantité disponible
0
Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
25 mai 2010 à 10:17
sans le code je ne peux pas t'aider
0
mb42 Messages postés 432 Date d'inscription vendredi 17 octobre 2008 Statut Membre Dernière intervention 14 janvier 2014 7
25 mai 2010 à 11:36
je parle de l'ancien code après modification

je te donne les fichiers

mais quand je fait le test je remarque que le message d'alerte(" Quantité supérieure à la disponible qui dois être afficher quant la quantité saisi est supérieur a la quantité disponible (récupérer de la BDD) n'a pas ete

afficher

le fichier famille.php

<html>
<head>
<title>Tutoriel Ajax (XHTML + JavaScript + XML)</title>

<script type='text/javascript'>

function getXhr(){
var xhr = null;
if(window.XMLHttpRequest) // Firefox et autres
xhr = new XMLHttpRequest();
else if(window.ActiveXObject){ // Internet Explorer
try {
xhr = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
}
else { // XMLHttpRequest non supporté par le navigateur
alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
xhr = false;
}
return xhr;
}

/**
* Méthode qui sera appelée sur le click du bouton
*/
function go(){
var xhr = getXhr();
// On défini ce qu'on va faire quand on aura la réponse
xhr.onreadystatechange = function(){
// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
if(xhr.readyState == 4 && xhr.status == 200){
leselect = xhr.responseText;
// On se sert de innerHTML pour rajouter les options a la liste
document.getElementById('article').innerHTML = leselect;



}
}

// Ici on va voir comment faire du post
xhr.open("POST","ajaxarticle.php",true);
// ne pas oublier ça pour le post
xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
// ne pas oublier de poster les arguments
// ici, l'id de la famille
sel = document.getElementById('famille');
idfamille = sel.options[sel.selectedIndex].value;
xhr.send("idfamille="+idfamille);
}






function verif_qantite() {
var xhr = getXhr2();
// On défini ce qu'on va faire quand on aura la réponse
xhr.onreadystatechange = function(){
// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
if(xhr.readyState == 4 && xhr.status == 200){
quantite_dispo=xhr.responseText;
q_saisie=document.getElementById('quantite').value;

if (q_saisie>quantite_dispo ){
alert("Quantité supérieure à la disponible !");

return false; //ça va empecher le formulaire d'être envoyé
}
else{
return true; //autorise l'envoi du formulaire
}

}

}

xhr.open("POST","ajax_quantite_article.php",true);
// ne pas oublier ça pour le post
xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
// ne pas oublier de poster les arguments
// ici, l'id de la famille
sel = document.getElementById('famille');
idfamille = sel.value;

idarticle = sel.options[sel.selectedIndex].value;

sel2=document.getElementById('article');
idarticle=sel2.value;
xhr.send("idfamille="+idfamille+"&idarticle="+idarticle);





}





</script>
</head>
<body>
<form action="suivre.php" method="post" name="form1" onSubmit="return verif_quantite;">



<table frame="box" rules="none">

<tr>
<td colspan="2" align="left"><div align="center">Veuillez remplir les champs</div></td>
</tr>


<tr><td>Famille</td>
<td><select name='famille' id='famille' onchange='go()'>
<option value='-1'>Aucun</option>

<?php

include('modele.php');
$result=retourfamille();
while($ligne=mysql_fetch_row($result))
{
echo"<option value=\"$ligne[0]\">$ligne[1]</option>";
}


?>

</select>
</td>
</tr>
<tr><td>article</td>
<td>
<div id='article' style='display:inline'>
<select name='article' id="article1">
<option value='-1'>Choisir une famille</option>
</select>
</div>

</td>
</tr>

<tr>
<td>
quantite</td>
<td>
<input type="text" name="quantite" id="quantite" value=""/>

</td>
</tr>
<tr>
<td colspan="2">

<input type="submit" value="enregister" name="envoyer"/>
</td>
</tr>
</table>
</form>
</body>
</html



le fichier ajax_quantite_article.php

<?php

if(isset($_POST["idarticle"])){
$serveur="localhost";
$user="user1";
$pwd="user1";
$db="glpi";
$lien=mysql_connect($serveur,$user,$pwd) or die("impossible de connecter de serveur");
mysql_select_db($db,$lien);


$query1="select qtestock from article where Reference=".$_POST["idarticle"]."";
$res1=mysql_query($query1);
$row=mysql_fetch_assoc($res1);
$quantite=$row['qtestock'];
echo $quantite;



}



?>



mais je remarque que dans tous les cas la page est envoyer vers

suivre.php quand je clique sur le bouton c'est qui implique que

cette fonction n'empêche pas l'envoi en cas de non vérifier la condition d'emprunté (dans la condition qui je déjà dis)



merci pour vos reponse
0
jeangilles Messages postés 816 Date d'inscription samedi 21 juin 2008 Statut Membre Dernière intervention 17 juillet 2012 186
25 mai 2010 à 11:44
Déjà, ta fonction s'appelle verif_qantite et tu appelles verif_quantite, faudrait harmoniser ^^


Ensuite, tu fais appel à une fonction, il faut donc les "()"

<form action="suivre.php" method="post" name="form1" onSubmit="return verif_quantite();"> 
0
mb42 Messages postés 432 Date d'inscription vendredi 17 octobre 2008 Statut Membre Dernière intervention 14 janvier 2014 7
25 mai 2010 à 12:09
MERCI pour votre réponse

mais de même comme je dis elle n'empeche pas l'envoi de formulaire

peut etre erreur dans cette fonction ou dans la valeur recupereur de

la BDD (depuis fichier ajax_quantite_article.php)

merci d'avance
0
jeangilles Messages postés 816 Date d'inscription samedi 21 juin 2008 Statut Membre Dernière intervention 17 juillet 2012 186
Modifié par jeangilles le 25/05/2010 à 13:22
ben si ton onsubmit retourne bien false, le formulaire ne doit pas s'envoyer !
0
Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
25 mai 2010 à 14:04
c'est un peu de ma faute j'ai oublié les () dans le onSubmit="verif_quantite();"

ensuite pour voir ce qui se passe:

function verif_quantite() {
var xhr = getXhr();
// On défini ce qu'on va faire quand on aura la réponse
xhr.onreadystatechange = function(){
// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
if(xhr.readyState == 4 && xhr.status == 200){
quantite_dispo=xhr.responseText; 
q_saisie=document.getElementById('quantite').value;
//rajoutes:
alert("Q_dispo_lue="+quantite_dispo+"   Q_saisie= "+q_saisie);
......
0