begin process at 2012 05 31 03:30:20
  Trouver un code source :
 
dans
 
Accueil > Forum > 

PHP

 > 

Base de données

 > 

MySQL

 > 

Menu deroulant dynamique ajax


Derniers messages déposésPoser une question dans le forum ou lancer une discussion

Menu deroulant dynamique ajax

lundi 28 août 2006 à 16:29:02 | Menu deroulant dynamique ajax

ns_deux


Bonjour,
Je cherche à faire un menu deroulant dynamique qui va interroger ma base mysql en temps réel. J'aimerais que, lorsque je cliques sur mon menu, il va recupérer les donnees de ma base et ce sans rechargement de ma page php.
Je sais qu'il existe de trucs avec Ajax mais je n'arrive pas à le faire fonctionner.
Quelqu'un a t-il une bidouille?
Merci d'avance.
lundi 28 août 2006 à 21:42:14 | Re : Menu deroulant dynamique ajax

coockiesch

Salut!
As-tu lu des tutos AJAX? (j'aime ceux de developpez.com)

Je te propose de commencer par ça. Ensuite, sur www.javascriptfr.com, y'a des exemples de menus déroulants dynamiques... Tu mixes les deux et c'est ok, :)

@++

R@f

www.allpotes.ch: Photos, humour, vidéos, gags, ...
"On dit que seulement 10 personnes au monde comprenaient Einstein. Personne ne me comprends. Suis-je un génie???"
mardi 29 août 2006 à 08:00:24 | Re : Menu deroulant dynamique ajax

ns_deux

voila ce que j'ai fait mais ca marche pas tu peux peut-etre m'aider....

<script type='text/javascript'>
var xhr = null;

function getXhr(){
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;
}
}

function recharge(page,val){

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

// On se sert de innerHTML pour rajouter les options a la liste
//eval(xhr.responseText);
document.getElementById('div'+val).innerHTML = xhr.responseText;
}
}

// Ici on va voir comment faire du Get
xhr.open("GET",page,true);
xhr.send(null);
}
</script>



<tr>
<td><div align="right"><strong>O.A.M : </strong></div></td>
<td>
<div id="divoam" onClick='recharge("requete_oam.php","oam")' >
<select name="oam" id="oam" style="width:240" >
<option value=""></option>
</select>
</div>
</td>
<td><a href="param_oam.php" onclick="window.open(this.href); return false;"><strong><img src="./icone/enreg.gif" alt="image"></strong></a></td>
<td>&nbsp;</td>
</tr>

------------------------------------------------------------
ma requete_oam.php

<?php
echo"<select name='oam' id='oam' style='width:240'>";
echo "<option value=''></option>";
require("connect_atelier.php");
$req = 'SELECT DISTINCT oam FROM oam ';
$res = mysql_query($req,$connect) or die ('Erreur : '.mysql_error() );
while($row = mysql_fetch_assoc($res)){
echo "<option value='".$row['oam']."'>".$row['oam']."</option>";
}
echo "</select>";

?>
Merci

mardi 29 août 2006 à 12:28:20 | Re : Menu deroulant dynamique ajax

coockiesch

Salut!
Je ne peux tester tout ton code pour toi!

Plusieurs pistes pour voir où se situe l'erreur:
- si tu affiches requete_oam.php, affiche-t-elle ce que tu veux?
- avec des alert en JS, vérifie que tout se passe bien:
  * l'objet xhr est-il bien créé?

Entre ces deux instruction:
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){

Ajoute:
alert('Status: ' + xhr.status );

Ca te diras si y'a un retour, si t'as une 404, ou bien...
Si tu as un code erreur 200, le pb vient peut être d l'affichage!

Regarde un peu d'où ca vient et redis nous, on trouvera! :)

@++

R@f

www.allpotes.ch: Photos, humour, vidéos, gags, ...
"On dit que seulement 10 personnes au monde comprenaient Einstein. Personne ne me comprends. Suis-je un génie???"
mardi 29 août 2006 à 16:51:18 | Re : Menu deroulant dynamique ajax

ns_deux

OK donc j'ai fait ce que tu m'as dit. J'ai allégé mon code afin de n'avoir en ligne que ce qui deconne et ca donne cà :

----------------------------------base_saisie_materiel.php----------------------------
<script type="text/javascript">
function getElement(id)
{
    var Elem;
   
    if(document.getElementById)
    {
        if (typeof document.getElementById(id) == "object")
            Elem = document.getElementById(id);
                else
                    Elem = void(0);
    }
    else if(document.all)
    {
        if (typeof document.all[id] == "object")
            Elem = document.all[id];
                else
                    Elem = void(0);
    }
    else if(document.layers)
    {
        if (typeof document[id] == "object")
            Elem = document[id];
                else
                    Elem = void(0);
    }
    else Elem = void(0);
   
    return Elem;
}


var xhr = null;

function getXhr()
{
    if (window.XMLHttpRequest)
    {
        xhr = new XMLHttpRequest();
    }
    else if (window.ActiveXObject)  // if IE
    {
        var ieversions = ['Msxml2.XMLHTTP',
                          'Microsoft.XMLHTTP',
                          'Msxml2.XMLHTTP.5.0',
                          'Msxml2.XMLHTTP.4.0',
                          'Msxml2.XMLHTTP.3.0'
                         ];
       
        for(var i=0; !xhr && i<ieversions.length; i++)
        {
            try
            {
                xhr = new ActiveXObject(ieversions[i]);
            }
            catch(e)
            {
                xhr = null;
            }
        }
    }
   
    if(!xhr)// XMLHttpRequest non supporté par le navigateur
        alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
}


/**
* Méthode qui sera appelée sur le click du bouton
*/
function requete(page,select,form,target,target1,target2,target3,target4)
{
    getXhr();
   
    xhr.onreadystatechange = function()
    {
        if(xhr.readyState == 4)
        {       
        if(xhr.status == 200 || xhr.status == 304)
            eval(xhr.responseText);
           
        }
    };
   
    xhr.open("POST",page,true);
    xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
    xhr.send("form="+escape(form)+"&type="+escape(select.id)+"&id="+escape(select.value)+"&target="+escape(target)+"&target1="+escape(target1)+"&target2="+escape(target2)+"&target3="+escape(target3)+"&target4="+escape(target4));
}


function requete2(page){
                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('modele').innerHTML = leselect;
                        eval(xhr.responseText);
                        alert('Status: ' + xhr.status );
                    }
                }

                // Ici on va voir comment faire du post
                xhr.open("GET",page,true);
                xhr.send(null);
            }
</script>

<table>
<tr>
      <td><div align="right"><strong>O.A.M : </strong></div></td>
      <td>
       <div id="divoam" onclick="javascript:requete2('requete_oam.php');">
       <?php
        echo "<select name='oam' id='oam' style='width:240' >";
    echo "<option value=''></option>";
    $req10 = 'SELECT DISTINCT oam FROM oam ';
    $res10 = mysql_query($req10,$connect) or die ('Erreur : '.mysql_error() );
    while($row10 = mysql_fetch_assoc($res10)){
    echo "<option value='".$row10['oam']."'>".$row10['oam']."</option>";
    }
    echo "</select>";
        ?>     
    </div>
      </td>
     
    </tr>
    <tr>
    </table>
-------------------------------------requete_oam.php--------------------------------
 <?php
      
        echo "<select name='oam' id='oam' style='width:240'>\n";
            echo "<option value=''></option>\n";
        require("connect_atelier.php");
        $req = 'SELECT DISTINCT oam FROM oam ';  
               $res = mysql_query($req,$connect) or die ('Erreur : '.mysql_error() );
               while($row = mysql_fetch_assoc($res)){
                echo "<option value='".$row['oam']."'>".$row['oam']."</option>";
        }
            echo"</select>"; 
        //echo 'document.getElementById("divoam").innerHTML = '.$str.';';
   
?>
-------------------------------------------------------------------------------------
Alors en ce qui concerne les resultat :
1- ma requete requete_oam.php fonctionne bien car elle me donne le resultat de ma requete.
2- Lorsque je clique sur le menu deroulant de ma page base_saisie_materiel.php, j'ai bien mon resultat mais il s'efface aussitot des que je retire le clic de souris
3- Avec  alert('Status: ' + xhr.status ); j'ai la meme chose avec le code erreur 200.
Voilà pour les resultat.
Qu'en penses tu?

mardi 29 août 2006 à 17:14:48 | Re : Menu deroulant dynamique ajax

ns_deux


J'ajoute meme que si je fais alert(eval(xhr.responseText)); j'ai bien le resultat obtenu dans le pop up
Je vois pas pourquoi il s'affiche pas ce resultat :-(
Merci encore
mardi 29 août 2006 à 17:42:04 | Re : Menu deroulant dynamique ajax

coockiesch

Salut!
Pourquoi faire ça sur le onClick, je comprends pas trop...
Je vois pas l'item: modele

@++

R@f

www.allpotes.ch: Photos, humour, vidéos, gags, ...
"On dit que seulement 10 personnes au monde comprenaient Einstein. Personne ne me comprends. Suis-je un génie???"
mardi 29 août 2006 à 19:03:03 | Re : Menu deroulant dynamique ajax

ns_deux



En fait je veux, lorsqu'on clic sur mon menu deroulant, qu'on ait le resultat de ma base en reel sans avoir besoin de
recharger ma page.
quel item modele?
Alors j'ai trouve un truc, j'avais un soucis sur ma requete dans mon select. maintenant c bon par contre c comme si je n'avais pas
le retour de mon resultat. Je m'explique. lorsque je clic sur mon menu deroulant j'ai les resultats de ma requete à l'instant de chargement
de la page. Par contre suite à une modification de la base, je ne retrouve pas mes resultat sans recharger ma page lorsque je clic sur le select alors qu'avec
 eval(xhr.responseText);
 alert('Status: ' + xhr.status );
j'ai bien tous les resultats dans le popup et 200 pour le statut
Comprend rien :-)
@++

mardi 29 août 2006 à 20:18:25 | Re : Menu deroulant dynamique ajax

ns_deux

Ca fonctionne presque lol
J'ai changé mon evenement par un onChange
Alors quand ma page se charge, il va verifier ma base et me donne les resultats au moins du chargement de la page.
Si je change pas la valeur, je peux voir les valeurs existantes et je peux ajouter un nouvel element dans ma base via une autre page pour reprendre ensuite ma page initiale
et modifier la valeur. Du coup, il execute la fonction et modifie mon menu deroulant par les nouvelles valeurs.
Gros point faible il ne le fait qu'une fois par chargement de page pourquoi?
je pensais au cache au debut du coup j'ai ajouté cà
header("Cache-control: no-store, no-cache, must-revalidate, post-check=0, pre-check=0"); 
header("Pragma: no-cache");
header("Cache-control: private");
mais pareil. Ca marche qu'une fois par chargement de page
As tu une idée?
Merci @++

vendredi 3 septembre 2010 à 17:46:36 | Re : Menu deroulant dynamique ajax

kfarmel24

slt c est bien mais j aimerais charger un select a partir d'un autre autre select les données d'une base de donnée en metant la condition sur le premier select c est a dire le where dans la requette sql

et j ai un probleme pour gerer les session lors de la connexion a la page d'accueil
mersi d'avance

je travail avec ajax


Cette discussion est classée dans : menu, base, dynamique, ajax, deroulant


Répondre à ce message

Sujets en rapport avec ce message

Menu dynamique PHP [ par zorax69 ] Hello,Je voudrais faire un menu vertical du type :gamme1___sous-gamme11______produit1______produit2___sous-gamme12______produit5______produit7gamme2__ il y a t'il un menu deroulant dynamique qui permet de selectionné un element et ensuite affiché les éléments correspondant a cette selection [ par antillais ] J'ai fait un formulaire de saisie qui enregistre des donnees ds une table appropriée...Dans ce formulaire il y a une partie que j'aimerais qu'il aille Comment faire un menu deroulant comme celui du site [ par MaXuo ] Je prend comme exemple le site phpcs.com car ce que je recherche si trouve. Comment fait on le menu Derniers Blogs soit que la personne clic sur le "- Menu déroulant dynamique [ par chris tuckers ] Salute tout le monde, je cherche a faire un menu déroulant dynamique.C'est à dire une liste ou j'ai le choix de ce que je veux faire afficher de ma ba largeur fixe du menu deroulant? [ par supertatane80 ] bonjour à tous,voila mon problème dans mon formulaire de saisi j'ai un menu deroulant qui affiche les donnees à partir d'une base de données mysql. Da Menu deroulant tableau dynamique [ par sensoide ] Bonjour a tous,Je vous resume le probléme, j'ai un menu deroulant créé grace a ma base mysql.J'ai un tableau qui m'affiche des données, ces données vi recuperer le choix d'un menu deroulant sans boutton d'activation [ par rachidphp93 ] bonjour tout le monde ;Bonjour, je voudrai recuperer le choix d'un menu deroulant sans un bouton et sans recharger la page?<font Classe menu dynamique [ par Teclis01 ] bonjour, Voila en fait j'aimerais faire une classe de menu classé en rang. comme ceci +rang1     +rang 1.1        -rang 1.1.1     -rang1.2 ... creation dynamique d'une requete sql [ par mechouiche42100 ] Bonjour,voici mon probleme j'ai un formulaire de recherche avec 5 menu deroulant.Je voudrai cree une requete selon les choix dans les menus deroulants menu dynamique [ par gabs77 ] bonjour, je suis débutant en php et je cherche a faire un menu dynamique pour mon site certes il y a du javascript mais je n y comprends rienest ce qu


Nos sponsors


Sondage...

CalendriCode

Mai 2012
LMMJVSD
 123456
78910111213
14151617181920
21222324252627
28293031   

Consulter la suite du CalendriCode

Photothèque

A découvrir



 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 0,452 sec (3)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales