Ajout de test en javascript avant l'envoi
mb42
Messages postés
553
Statut
Membre
-
Alain_42 Messages postés 5413 Statut Membre -
Alain_42 Messages postés 5413 Statut Membre -
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
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
10 réponses
-
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 -
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 -
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 -
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;
-
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question -
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 -
-
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 -
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 -
ben si ton onsubmit retourne bien false, le formulaire ne doit pas s'envoyer !
-
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); ......
