11540 sujets

JavaScript, DOM et API Web HTML5

Je sais pas comment faire

mon code est le suivant 

<html>
	<head>
    	<title>Recherche Dynamique Via AJAX</title>
        <script src="js/xhr.js"></script>
        <script>
        
        </script>
    </head>
    <body style="margin-bottom:0 auto">
    	<div style="border-bottom-color:#000">
			<select onchange="affiche_title()">
            <?php 
            include "connexion.php";
			$req = mysql_query("select * from livres");
			
			while($row = mysql_fetch_array($req)){
			?>
            	<option><?php echo $row['auteur']; ?> </option> <?php $a=$row['auteur'];   }?>
            </select>
          
            <div id="contain"></div>
        </div>
    </body>
</html>


je dois faire apparaître dans le div contain la valeur sélectionné avec ajax et je débute dedans !
toute aide ne sera pas de refus, merci d'avance Smiley smile .

Edit : j'ajoute la fonction js que j'ai crée si on peut me corriger ou me proposer une autre solution en ajax je suis preneur 

function affiche_title(){
    	
        	document.getElementById('contain').innerHTML = '';
    	   	var blocListe = document.getElementById('contain');
        	blocListe.innerHTML = "Traitement en cours, veuillez patienter...";
        	creerRequete();
        	var text = this[this.selectedIndex].text;
       	 	requete.open('GET', text, true);
        	requete.onreadystatechange = function(){
            	if(requete.readyState == 4){
                	if(requete.status == 200){
                	   actualiser_title();
                	}
            	}
        	};
        	requete.send(null);
    	
	}

Modifié par Freezlike (29 Oct 2012 - 22:17)
j'ai finis par trouver la solution
index.php

<html>
	<head>
    	<title>Recherche Dynamique Via AJAX</title>
        <script src="js/xhr.js"></script>
        <script>
        
        </script>
    </head>
    <body style="margin-bottom:0 auto">
    	<div style="border-bottom-color:#000">
			<select onchange="javascript:affiche_title(this.value)">
            <?php 
            include "connexion.php";
			$req = mysql_query("select * from livres");
			
			while($row = mysql_fetch_array($req)){
			?>
            	<option value="<?php echo $row['auteur']; ?>"><?php echo $row['auteur']; ?></option><?php  }?>
            </select>
            <div id="contain"></div>
        </div>
    </body>
</html>


xhr.js

var requete = null;
function creerRequete(){
    try{
        /* On tente de créer un objet XmlHTTPRequest */
        requete = new XMLHttpRequest();
    }catch (microsoft){
        /* Microsoft utilisant une autre technique, on essays de créer un objet ActiveX */
        try{
            requete = new ActiveXObject('Msxml2.XMLHTTP');
        }catch(autremicrosoft){
            /* La première méthode a échoué, on en teste une seconde */
            try{
                requete = new ActiveXObject('Microsoft.XMLHTTP');
            }catch(echec){
                /* À ce stade, aucune méthode ne fonctionne... mettez donc votre navigateur à jour [cligne] */
                requete = null;
            }
        }
    }
    if(requete == null){
        alert('Impossible de créer l\'objet requête,\nVotre navigateur ne semble pas supporter les object XMLHttpRequest.');
    }
}

function actualiser_title(){
    	var liste = requete.responseText;
    	var blocListe = document.getElementById('contain'); 
    	blocListe.innerHTML = liste;
	}
//---------------------------------------------------------

function affiche_title(p1){
		var blocListe = document.getElementById('contain'); 
		creerRequete();
		var url = 'title.php?p1='+p1;
		requete.open('GET', url, true);
		requete.onreadystatechange = function(){
            	if(requete.readyState == 4){
                	if(requete.status == 200){
                	    actualiser_title();
						
                	}
            	}
        	};
        	requete.send(null);
    	}
Sujet clos
Aller à