Menu déroulant dynamique php/mysql et ajax
Résolu/Fermé
papymucho
Messages postés
140
Date d'inscription
mercredi 18 juin 2008
Statut
Membre
Dernière intervention
1 novembre 2009
-
28 août 2008 à 13:55
papymucho Messages postés 140 Date d'inscription mercredi 18 juin 2008 Statut Membre Dernière intervention 1 novembre 2009 - 1 déc. 2008 à 14:34
papymucho Messages postés 140 Date d'inscription mercredi 18 juin 2008 Statut Membre Dernière intervention 1 novembre 2009 - 1 déc. 2008 à 14:34
A voir également:
- Menu déroulant dynamique php/mysql et ajax
- Tableau croisé dynamique - Guide
- Menu déroulant excel - Guide
- Excel menu déroulant en cascade - Guide
- Menu déroulant google sheet - Accueil - Guide bureautique
- Windows 11 menu démarrer classique - Guide
9 réponses
Yohan_
Messages postés
237
Date d'inscription
vendredi 27 juin 2008
Statut
Membre
Dernière intervention
12 août 2010
83
28 août 2008 à 18:02
28 août 2008 à 18:02
Le fichier rep_PhpAjax.php :
<?php
// SCRIPT PHP D'INTERROGATION DE LA BASE DE DONNEES POUR REPONSE A LA REQUETE AJAX
include_once 'conf/conf.php';
mysql_connect(_DB_HOST,_DB_LOGIN,_DB_PWD);
mysql_select_db(_DB_NAME);
// REQUETE POUR LA BASE DE DONNEES
$result_recherche=mysql_query("SELECT * FROM sous_familles WHERE ".'code_famille'."='".$_POST[val_sel]."' ORDER BY ".'code_sous_famille'." ASC ");
// CONSTRUCTION DE LA DEUXIEME LISTE DEROULANTE
$aff=="";
$aff=$aff."Sous Famille:<br>
<select name='niv2' id='cont_list2' >";
while ($row=mysql_fetch_assoc($result_recherche))
{
$aff.="<option value=\"$row[code_sous_famille]\">$row[code_sous_famille]</option>";
}
$aff=$aff."</select><br><br>";
// ENVOI DE LA REPONSE PHP A AJAX
echo $aff;
?>
<?php
// SCRIPT PHP D'INTERROGATION DE LA BASE DE DONNEES POUR REPONSE A LA REQUETE AJAX
include_once 'conf/conf.php';
mysql_connect(_DB_HOST,_DB_LOGIN,_DB_PWD);
mysql_select_db(_DB_NAME);
// REQUETE POUR LA BASE DE DONNEES
$result_recherche=mysql_query("SELECT * FROM sous_familles WHERE ".'code_famille'."='".$_POST[val_sel]."' ORDER BY ".'code_sous_famille'." ASC ");
// CONSTRUCTION DE LA DEUXIEME LISTE DEROULANTE
$aff=="";
$aff=$aff."Sous Famille:<br>
<select name='niv2' id='cont_list2' >";
while ($row=mysql_fetch_assoc($result_recherche))
{
$aff.="<option value=\"$row[code_sous_famille]\">$row[code_sous_famille]</option>";
}
$aff=$aff."</select><br><br>";
// ENVOI DE LA REPONSE PHP A AJAX
echo $aff;
?>
Yohan_
Messages postés
237
Date d'inscription
vendredi 27 juin 2008
Statut
Membre
Dernière intervention
12 août 2010
83
28 août 2008 à 14:04
28 août 2008 à 14:04
Si tu veux je peux te filer un de mes codes qui marchait exactement sur le même principe x)
Yohan_
Messages postés
237
Date d'inscription
vendredi 27 juin 2008
Statut
Membre
Dernière intervention
12 août 2010
83
28 août 2008 à 18:00
28 août 2008 à 18:00
Voila et commenté qui plus est :)
<html>
<head>
<!-- SCRIPT DE LISTES DEROULANTES LIEES AVEC APPEL PAR AJAX (EVITE LE RECHARGEMENT DE LA PAGE) -->
<script language="Javascript" type="text/JavaScript">
// FONCTION DE REQUETE AJAX
function makeRequest(url,id_niveau,id_ecrire)
{
// CREER UNE INSTANCE (UN OBJET) DE LA CLASSE DESIREE FONCTIONNANT SUR PLUSIEURS NAVIGATEURS
var http_request = false;
// POUR MOZILLA ET SAFARI
if (window.XMLHttpRequest)
{
http_request = new XMLHttpRequest();
if (http_request.overrideMimeType)
{
// UN APPEL DE FONCTION SUPPLEMENTAIRE POUR ECRASER L'EN TETE ENVOYE PAR LE SERVEUR (AU CAS OU IL NE S'AGIT PAS DE TEXT/XML, CAS DE CERTAINES VERSIONS DE FIREFOX
http_request.overrideMimeType('text/xml');
}
}
// POUR IE
else if (window.ActiveXObject)
{
try
{
http_request = new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e)
{
try
{
http_request = new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e) {}
}
}
if (!http_request)
{
alert('Abandon :( Impossible de créer une instance XMLHTTP');
return false;
}
// FONCTION DE TRAITEMENT APPELLEE QUAND ON RECEVRA LA REPONSE
http_request.onreadystatechange = function() { traitementReponse(http_request,id_ecrire); }
// LANCEMENT DE LA REQUETE
http_request.open('POST', url, true);
// CHANGER LE TYPE MIME DE LA REQUETE POUR ENVOYER LES DONNEES AVEC LA METHODE POST
http_request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
obj=document.getElementById(id_niveau);
data="val_sel="+obj.value;
http_request.send(data);
}
// FONCTION DE TRAITEMENT
function traitementReponse(http_request,id_ecrire)
{
var affich="";
if (http_request.readyState == 4)
{
// CAS AVEC REPONSE DE PHP EN MODE TEXTE
if (http_request.status == 200)
{
// CHARGEMENT DES ELEMENTS RECUS DANS LA LISTE
var affich_list=http_request.responseText;
obj = document.getElementById(id_ecrire);
obj.innerHTML = affich_list;
}
else
{
alert('Un problème est survenu avec la requête.');
}
}
}
</script>
</head>
<body>
<form name="test1" method="post" action="affiche.php" >
<div id="id_list1">Famille<br>
<select name="niv1" id="id_niv1" onChange="makeRequest('rep_PhpAjax.php','id_niv1','id_list2')">
<option value="NC">-- Choisissez votre famille --</option>
</select>
<br><br>
</div>
<div id="id_list2">
<!-- ICI SERA CHARGE LA LISTE SELON LA REPONSE MODE TEXTE DE PHP A LA REQUETE AJAX -->
</div>
<input type="submit" name="OK" value="OK">
</form>
</body>
</html>
<html>
<head>
<!-- SCRIPT DE LISTES DEROULANTES LIEES AVEC APPEL PAR AJAX (EVITE LE RECHARGEMENT DE LA PAGE) -->
<script language="Javascript" type="text/JavaScript">
// FONCTION DE REQUETE AJAX
function makeRequest(url,id_niveau,id_ecrire)
{
// CREER UNE INSTANCE (UN OBJET) DE LA CLASSE DESIREE FONCTIONNANT SUR PLUSIEURS NAVIGATEURS
var http_request = false;
// POUR MOZILLA ET SAFARI
if (window.XMLHttpRequest)
{
http_request = new XMLHttpRequest();
if (http_request.overrideMimeType)
{
// UN APPEL DE FONCTION SUPPLEMENTAIRE POUR ECRASER L'EN TETE ENVOYE PAR LE SERVEUR (AU CAS OU IL NE S'AGIT PAS DE TEXT/XML, CAS DE CERTAINES VERSIONS DE FIREFOX
http_request.overrideMimeType('text/xml');
}
}
// POUR IE
else if (window.ActiveXObject)
{
try
{
http_request = new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e)
{
try
{
http_request = new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e) {}
}
}
if (!http_request)
{
alert('Abandon :( Impossible de créer une instance XMLHTTP');
return false;
}
// FONCTION DE TRAITEMENT APPELLEE QUAND ON RECEVRA LA REPONSE
http_request.onreadystatechange = function() { traitementReponse(http_request,id_ecrire); }
// LANCEMENT DE LA REQUETE
http_request.open('POST', url, true);
// CHANGER LE TYPE MIME DE LA REQUETE POUR ENVOYER LES DONNEES AVEC LA METHODE POST
http_request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
obj=document.getElementById(id_niveau);
data="val_sel="+obj.value;
http_request.send(data);
}
// FONCTION DE TRAITEMENT
function traitementReponse(http_request,id_ecrire)
{
var affich="";
if (http_request.readyState == 4)
{
// CAS AVEC REPONSE DE PHP EN MODE TEXTE
if (http_request.status == 200)
{
// CHARGEMENT DES ELEMENTS RECUS DANS LA LISTE
var affich_list=http_request.responseText;
obj = document.getElementById(id_ecrire);
obj.innerHTML = affich_list;
}
else
{
alert('Un problème est survenu avec la requête.');
}
}
}
</script>
</head>
<body>
<form name="test1" method="post" action="affiche.php" >
<div id="id_list1">Famille<br>
<select name="niv1" id="id_niv1" onChange="makeRequest('rep_PhpAjax.php','id_niv1','id_list2')">
<option value="NC">-- Choisissez votre famille --</option>
</select>
<br><br>
</div>
<div id="id_list2">
<!-- ICI SERA CHARGE LA LISTE SELON LA REPONSE MODE TEXTE DE PHP A LA REQUETE AJAX -->
</div>
<input type="submit" name="OK" value="OK">
</form>
</body>
</html>
papymucho
Messages postés
140
Date d'inscription
mercredi 18 juin 2008
Statut
Membre
Dernière intervention
1 novembre 2009
220
28 août 2008 à 14:41
28 août 2008 à 14:41
Salut Yohan,
Volontier oui ça pourrait m'aider :)
Si ton code est commenté ce serait vraiment tip-top, que je puisse comprendre au passage.
Cordialement,
Volontier oui ça pourrait m'aider :)
Si ton code est commenté ce serait vraiment tip-top, que je puisse comprendre au passage.
Cordialement,
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
papymucho
Messages postés
140
Date d'inscription
mercredi 18 juin 2008
Statut
Membre
Dernière intervention
1 novembre 2009
220
28 août 2008 à 16:14
28 août 2008 à 16:14
Désolé mais up :)
Yohan_
Messages postés
237
Date d'inscription
vendredi 27 juin 2008
Statut
Membre
Dernière intervention
12 août 2010
83
28 août 2008 à 17:55
28 août 2008 à 17:55
Désolé problème de connection tout à l'heure ^^
Je te mets le code de suite ;)
Je te mets le code de suite ;)
papymucho
Messages postés
140
Date d'inscription
mercredi 18 juin 2008
Statut
Membre
Dernière intervention
1 novembre 2009
220
28 août 2008 à 18:24
28 août 2008 à 18:24
Merci bien :)
Le temps d'y comprendre quelque chose, et je suis de retour.
Le temps d'y comprendre quelque chose, et je suis de retour.
papymucho
Messages postés
140
Date d'inscription
mercredi 18 juin 2008
Statut
Membre
Dernière intervention
1 novembre 2009
220
1 sept. 2008 à 13:19
1 sept. 2008 à 13:19
Salut,
Bon et bien, je n'ai pas bien compris ton code, mais j'ai fini par faire différement, je laisse la soluce ici pour ceux qui en auraient besoin.:
le premier select (_inc_select_equipment.php) :
<select id='form_equipment' name='form_equipment' onchange="get_url(this)">
<option value='void'>Choose an equipment</option>
<?php
include("_inc_connexion.php");
//$equipment=$_POST[equipment'];
$query = "SELECT id_equipment, equipment FROM T_equipment ORDER BY equipment ASC";
$rq = mysql_query($query); //or die ("Exécution de la requête impossible");
while ($row=mysql_fetch_array($rq, MYSQL_ASSOC))
{
$id_equipment = $row["id_equipment"];
$equipment = $row["equipment"];
echo "<option value='$id_equipment'>$equipment</option>";
}
mysql_close();
?>
</select>
le second select (_inc_select_model.php) :
<select name='form_model'>
<option value='void'>Choose a model</option>
<?php
include("_inc_connexion.php");
//$form_model=$_POST['form_model'];
$var=$_POST['var'];
$query = "SELECT model FROM T_model WHERE id_equipment='$var' ORDER BY model ASC";
$rq = mysql_query($query); //or die ("Exécution de la requête impossible");
while ($model = mysql_fetch_array($rq))
{
extract($model);
if ($model!="")
{
echo "<option value='$model'>$model</option>";
}
}
mysql_close();
?>
</select>
la fonction ajax (a noter qu'il faut disposer de jquery pour que ça fonctionne) :
function get_url(test)
{
$.ajax
(
{
type: "POST",
url: "_inc_select_model.php",
data: "var="+test,
success: function(msg){$("#tr_test").append("<td class='title'><b>Model :</b></td><td>"+ msg +"</td>");}
}
);
$("#tr_test").show();
}
et enfin le formulaire :
<div>
<center>
<fieldset class='fieldset'>
<legend class='first_step'>First step : <br>Please check the availability of the equipment or the model</legend>
<table class='check_equipment'>
<tr>
<td class='title'><b>Equipment :</b></td><td><?php include('_inc_select_equipment.php') ?></td>
</tr>
<tr id='tr_test'>
</tr>
</table>
</fieldset>
</center>
</div>
Voilà voilà, et désolé pour l'indentation...
Bon et bien, je n'ai pas bien compris ton code, mais j'ai fini par faire différement, je laisse la soluce ici pour ceux qui en auraient besoin.:
le premier select (_inc_select_equipment.php) :
<select id='form_equipment' name='form_equipment' onchange="get_url(this)">
<option value='void'>Choose an equipment</option>
<?php
include("_inc_connexion.php");
//$equipment=$_POST[equipment'];
$query = "SELECT id_equipment, equipment FROM T_equipment ORDER BY equipment ASC";
$rq = mysql_query($query); //or die ("Exécution de la requête impossible");
while ($row=mysql_fetch_array($rq, MYSQL_ASSOC))
{
$id_equipment = $row["id_equipment"];
$equipment = $row["equipment"];
echo "<option value='$id_equipment'>$equipment</option>";
}
mysql_close();
?>
</select>
le second select (_inc_select_model.php) :
<select name='form_model'>
<option value='void'>Choose a model</option>
<?php
include("_inc_connexion.php");
//$form_model=$_POST['form_model'];
$var=$_POST['var'];
$query = "SELECT model FROM T_model WHERE id_equipment='$var' ORDER BY model ASC";
$rq = mysql_query($query); //or die ("Exécution de la requête impossible");
while ($model = mysql_fetch_array($rq))
{
extract($model);
if ($model!="")
{
echo "<option value='$model'>$model</option>";
}
}
mysql_close();
?>
</select>
la fonction ajax (a noter qu'il faut disposer de jquery pour que ça fonctionne) :
function get_url(test)
{
$.ajax
(
{
type: "POST",
url: "_inc_select_model.php",
data: "var="+test,
success: function(msg){$("#tr_test").append("<td class='title'><b>Model :</b></td><td>"+ msg +"</td>");}
}
);
$("#tr_test").show();
}
et enfin le formulaire :
<div>
<center>
<fieldset class='fieldset'>
<legend class='first_step'>First step : <br>Please check the availability of the equipment or the model</legend>
<table class='check_equipment'>
<tr>
<td class='title'><b>Equipment :</b></td><td><?php include('_inc_select_equipment.php') ?></td>
</tr>
<tr id='tr_test'>
</tr>
</table>
</fieldset>
</center>
</div>
Voilà voilà, et désolé pour l'indentation...
Bonjour Papymucho,
J'essaie de faire fonctionner ton script mais je n'y arrive pas.
Pourrais tu commenter la fonction ajax je ne connais pas ce langage et si tu peux aussi me renseigner sur l'endroit ou trouver jquery.
j'utilise wamp comme serveur web/mysql et je ne sais pas si il est déjà présent.
Je te remercie.
J'essaie de faire fonctionner ton script mais je n'y arrive pas.
Pourrais tu commenter la fonction ajax je ne connais pas ce langage et si tu peux aussi me renseigner sur l'endroit ou trouver jquery.
j'utilise wamp comme serveur web/mysql et je ne sais pas si il est déjà présent.
Je te remercie.
papymucho
Messages postés
140
Date d'inscription
mercredi 18 juin 2008
Statut
Membre
Dernière intervention
1 novembre 2009
220
1 déc. 2008 à 14:34
1 déc. 2008 à 14:34
Bonjour Balgrim,
Je ne viens de voir ton message que maintenant.
Ajax n'est pas un langage, c'est une méthode servant à recharger certains éléments de ta page sans recharger toute ta page.... (Donc envoyer des requêtes sur un serveur tout en gardant ta page telle quelle par ex..)
Le langage utilisé est javascript.
Jquery n'a rien à voir avec Wamp, c'est un "framework" pour javascript, qui facilite la programmation sous js, tant du côté des animations que dans l'écriture de fonctions ajax etcetc...
Pour le trouver, une simple recherche sur google, avec pour mot clé "jquery" fera l'affaire ;-)
Enfin, je te renvois ici :
http://www.commentcamarche.net/forum/affich 8434526 liste deroulante php bd mysql pb codification?page=4#68
Le code n'est pas plus commenté mais bon...
Je ne viens de voir ton message que maintenant.
Ajax n'est pas un langage, c'est une méthode servant à recharger certains éléments de ta page sans recharger toute ta page.... (Donc envoyer des requêtes sur un serveur tout en gardant ta page telle quelle par ex..)
Le langage utilisé est javascript.
Jquery n'a rien à voir avec Wamp, c'est un "framework" pour javascript, qui facilite la programmation sous js, tant du côté des animations que dans l'écriture de fonctions ajax etcetc...
Pour le trouver, une simple recherche sur google, avec pour mot clé "jquery" fera l'affaire ;-)
Enfin, je te renvois ici :
http://www.commentcamarche.net/forum/affich 8434526 liste deroulante php bd mysql pb codification?page=4#68
Le code n'est pas plus commenté mais bon...