[Réglé] affichage d'un tableau choisi en AJAX

10 réponses - 4797 vues
Bonjour, je viens de découvrir l'Ajax, qui a l'air super intéressant. d'ailleurs le site est très bien sachant que la doc est pas toujours dispo sur le net au sujet de l'ajax. Voila, j'essaie d'afficher un tableau d'un type spécifique de média, qui lui est choisi par formulaire, le tout sans recharger ma page. Donc si j'ai bien compris, l'ajax me permettrai de le faire. Le problème, est que je dois lancer un traitement PHP avec une requête SQL, et c'est là que ca bloque. J'arrive pas à exécuter le traitement, ou alors s'il s'exécute, je n'arrive pas à l'afficher. Car je voudrais l'afficher en dessous de mon formulaire (avec les balises div), mais je sais pas comment le dire à mon traitement. Mon autre problème je pense vient au moment ou j'utilise le send() car je sais pas passer ma valeur ds ma variable data, et ds mon traitement je sais pas la récupérer.
Si quelqu'un pouvait regarder vite, fait, ca me ferait bien plaisir.
merci
**Code **
``
<script language="Javascript">

function DATATRY(value, page)
{
if(window.XMLHttpRequest) // Firefox
xhr_object = new XMLHttpRequest();
else
{
if(window.ActiveXObject) // Internet Explorer
xhr_object = new ActiveXObject("Microsoft.XMLHTTP");
else { // XMLHttpRequest non supporté par le navigateur
alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
return false;
}
}
xhr_object.open("POST",page, true);


xhr_object.onreadystatechange = function()
{
if(xhr_object.readyState == 4)
document.GetElementById('tableau').innerHTML=xhr_object.responseXML;
}

xhr_object.SetRequestHeader("Content-type", "application/x-www-form-urlencoded");
var data = "index.php?id="+value;
window.open(data);

xhr_object.send(data);
}
</script>
Bienvenue sur la page de consultation. Ici, vous pouvez consulter le catalogue de la médiathèque.
<br><br>
Choisissez le type de média dont vous voulez consulter la liste:<br>

<form name="form1" action="?" method="post">
<select name="typemed">
<option>--------------------
<?
$query=mysql_query("SELECT DISTINCT type FROM media ORDER BY type");
while ($ligne = mysql_fetch_array($query))
{
?><option><?echo "$ligne[0]";?>

<? } ?>
</select><br>
<a href="javascript:DATATRY(document.form1.typemed.value , 'consult.php')">GO</a>
</form>
<div id="tableau"></div>

``
et ca c le fichier consult.php :
**Code **
``
<?
if(isset($_POST['typemed'])){
header('Content-type: text/html; charset=iso-8859-1');
// on inclut la connexion
require_once('connexion.php');
// on fait la requête
$sql = "SELECT `infocomp`, `titre`FROM `media` WHERE `type` LIKE '".$_POST['typemed']."%' ORDER BY `infocomp`,`titre`";
$req = mysql_query($sql);
echo ' <table class="tableau"><tr><td align=center>REALISATEUR</td><td align=center>TITRE</td></tr>';
while($ligne = mysql_fetch_array($req))
{
echo '<tr><td>'.$ligne['infocomp'].'</td><td>'.$ligne['titre'].'</td></tr>';
}
echo ' </table>';
}
?>

``
Ton connexion.php met-il bien en place la connexion MySQL ? Il vient faire quoi le index.php dans ton JS ?
index.js c'est le nom de ma page en cours. J'ai résolu mon problème, maintenant ca marche nickel. voici mon code correct. Il reste plus qu'à le décorer : **:**
> <script language="Javascript">
function DATATRY(value)
{
if(window.XMLHttpRequest) // Firefox
xhr_object = new XMLHttpRequest();
else
{
if(window.ActiveXObject) // Internet Explorer
xhr_object = new ActiveXObject("Microsoft.XMLHTTP");
else
{ // XMLHttpRequest non supporté par le navigateur
alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
return false;
}
}
var url= "consult.php?typemed="+escape(value);
xhr_object.open("GET",url, false);
xhr_object.SetRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhr_object.send(null);

if(xhr_object.readyState == 4)
document.getElementById('tableau').innerHTML = xhr_object.responseText;
else
return(false);
}
</script>

Bienvenue sur la page de consultation. Ici, vous pouvez consulter le catalogue de la médiathèque.
<br><br>
Choisissez le type de média dont vous voulez consulter la liste:<br>
<form name="form1" method="GET">
<select name="typemed">

<option value="">--------------------
<?
$query=mysql_query("SELECT DISTINCT type FROM media ORDER BY type");
while ($ligne = mysql_fetch_array($query))
{
?><option value="<?echo "$ligne[0]";?>"><?echo "$ligne[0]";?>
<? } ?>

</select><br>
<a href="javascript:DATATRY(document.form1.typemed.value)">GO</a>
</form>
<div id="tableau"></div>

et pour le traitement php, rien ne change. Merci en, tout cas pour le tutoriel sur ajax ca m'a bien aidé, même si ca reste encore un peu obscur pour moi.[/quote]
De rien :)
Alors je sais pas pourquoi, mais depuis aujourd'hui firebug me met : "xhr_object.SetRequestHeader is not a function
fonctions.js (line 18)
DataConsultfonctions.js (line 18)
onchangeconsultation.php (line 1)", alors que je ne pense pas avoir changé, et qd je mets en commentaire la ligne de fonciton.js, qui est :
xhr_object.SetRequestHeader("Content-type", "application/x-www-form-urlencoded");
et ben il marche nickel. J'en suis perplexe...
Et t'as rien fait ? une maj de xhr ou une maj de firebug ?
non, j'ai juste installé firebug entre ajd'hui et la derniere fois que j'ai regardé la page. Et je viens d'essayer avec IE et ca marche bien!!!!
Si tu ne la mets pas en commentaire sous firefox, ça marche pas ?
non, ca marche pas. Il me met ce que j'ai écrit au dessus et il reste sur la page sans afficher mon tableau.
Je pense que se soit un buG de _ton_ côté. Avant sur le sit, j'utilisais la classe xhrConnection de sutekidane et dès que je voulais tracer les requetes AJAX via FireBug, bah en fait il me prennait la réponse des requetes et du coup ma page ne finissait jamais de charger ..

(10 résultats)


Catégories


Tags


Liens