11540 sujets

JavaScript, DOM et API Web HTML5

[Résolu] Ajax... Survol des lignes d'un tableau... A l'aide, svp

Bonjour,

Avant tout,
je vous souhaite à tous une excellente année 2013 !

Puis-je vous demander votre aide pour dépatouiller mon code ?
Cela devrait fonctionner...
Mais, ce n'est pas le cas !
Une chose m'échappe ! Mais quoi ?
Pouvez-vous m'aider ?

Je charge d'abord en tête de ma page 'recherche00.php'
<script type="text/javascript" src="js/requete.js"></script>


Et ensuite, entre head et /head,

<script type="text/javascript">
        	function search(id) {
		oRecord = id;
		var requete = creerRequete();
		var url = "php/ajaxphp_post.php";
		requete.open("POST", url, true);
		requete.onreadystatechange = function() {
			detailon(requete);	
		}
		requete.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
		requete.send("reference="+escape(oRecord);
	}

	function detailon(id) {
		if (requete.readyState == 4 && requete.status == 200) {
			oInfos = document.getElementById('bloc32')
			oInfos.innerHTML = requete.responseTEXT;
/*
			document.getElementById('bloc32').innerHTML=
				"<p><span class='bold'>DETAILS DU DIAMANT : </span><br></p>"+
				"<br>"+
				"<p><span class='bold'>Référence : </span>"+id+"</p>"+
				"<p><span class='bold'>Profondeur : </span>"+id+"</p>"+
				"<p><span class='bold'>Table : </span>"+id+"</p>"+
				"<p><span class='bold'>Rondiste : </span>"+id+"</p>"+
				"<p><span class='bold'>Symétrie : </span>"+id+"</p>"+
				"<p><span class='bold'>Poli : </span>"+id+"</p>"+
				"<p><span class='bold'>Colette : </span>"+id+"</p>"+
				"<p><span class='bold'>Fluorescence : </span>"+id+"</p>"+
				"<p><span class='bold'>Dimensions : </span><br>"+id+"</p>"+
				"<p><span class='bold'>Rapport<br>longueur/largeur : </span>"+id+"</p>"+
				"<p><span class='bold'>Prix par carat : </span><br>"+id+"</p>";
*/
		}
	}
	
	function detailoff(id) {		
		oInfos = document.getElementById('bloc32')
		oInfos.innerHTML = 
			"<p><span class='bold'>DETAILS DU DIAMANT : </span><br></p>"+
			"<br>"+
			"<p><span class='bold'>Référence : </span></p>"+
			"<p><span class='bold'>Profondeur : </span></p>"+
			"<p><span class='bold'>Table : </span></p>"+
			"<p><span class='bold'>Rondiste : </span></p>"+
			"<p><span class='bold'>Symétrie : </span></p>"+
			"<p><span class='bold'>Poli : </span></p>"+
			"<p><span class='bold'>Colette : </span></p>"+
			"<p><span class='bold'>Fluorescence : </span></p>"+
			"<p><span class='bold'>Dimensions : </span><br><br></p>"+
			"<p><span class='bold'>Rapport<br>longueur/largeur : </span></p>"+
			"<p><span class='bold'>Prix par carat : </span><br><br></p>";
	}
</script>


Maintenant, voici l'endroit où l'ajax est sollicité :

$nbresultat=0;
$query = mysql_query("SELECT * FROM data");
while ($back = mysql_fetch_assoc($query)) {
	if (trim($back['purete']) == "VVS1") {
		$nbresultat++;
		$prixcarat = 1;
		$rll = 1;
		echo "<tr onmouseover='search(".trim($back['reference']).");' onmouseout='detailoff();' style='cursor:pointer;'>";
		echo 	"<td align='center' style='width:25px;'>";
		   $id= "comparer".sprintf('%02d', $nbresultat);
		   echo "<input type='checkbox' name='comparer[".$nbresultat."]' id='".$id."' class='curseur' ";
		   echo "value='".$nbresultat."'> ";
		   echo "</td>";
		echo 	"<td align='left'>".trim($back['reference'])."</td>";
		echo 	"<td align='left'>".trim($back['forme'])."</td>";
		echo 	"<td align='right' style='width:30px;'>".trim($back['poids'])."</td>";
		echo 	"<td align='left'>".trim($back['taille'])."</td>";
		echo 	"<td align='center' style='width:45px;'>".trim($back['couleur'])."</td>";
		echo 	"<td align='center' style='width:45px;'>".trim($back['purete'])."</td>";
		echo 	"<td align='center' style='width:45px;'>".trim($back['poli'])."</td>";
		echo 	"<td align='center' style='width:45px;'>".trim($back['symetrie'])."</td>";
		echo 	"<td align='center' style='width:45px;'>".trim($back['profondeur'])."</td>";
		echo 	"<td align='center' style='width:45px;'>".trim($back['tabless'])."</td>";
		echo 	"<td align='center' style='width:45px;'>".trim($back['fluorescence'])."</td>";
		echo 	"<td align='right' style='width:45px;'>".""."</td>";
		echo 	"<td align='center' style='width:45px;'>".trim($back['culetfr'])."</td>";
		echo 	"<td align='right' style='width:45px;'>".trim($back[''])."</td>";
		echo 	"<td align='right'>délai</td>";
		echo 	"<td align='right'>".trim($back['prixsite'])."</td>";
		echo 	"<td align='center'><a href=''><div class='voir'>Détails</div></a></td>";
		echo "</tr>";
	}
}



Voici maintenant, "js/requete.js"

// JavaScript Document

function creerRequete() {
	var requete = null;
	try {
		requete = new XMLHttpRequest();	
	} catch (essaimicrosoft) {
		try {
			requete = new ActiveXObject("Msxml2.XMLHTTP");	
		} catch (autremicrosoft) {
			try {
				requete = new ActiveXObject("Microsoft.XMLHTTP");	
			} catch (echec) {
				requete = null;
			}
		}
	}

	if (requete == null) {
		alert("Impossible de créer l'objet requete");
	} else {
		return requete;
	}	
}


Et aussi, "php/ajaxphp_post.php" :

<?php
	session_start();

	date_default_timezone_set('Europe/Brussels');

	require_once("connexionMysql.inc.php");

	$query = "SELECT * FROM data WHERE reference='".$reference."' ";
	$back = mysql_fetch_assoc($query);

	$retour = "";
	$retour .= trim($back['purete']);




	echo $retour;
	
	mysql_free_result($back);
	mysql_close($connexion);
?>

Modifié par jytest (04 Jan 2013 - 11:05)
Bonsoir,

Il manque une parenthèse fermante a
requete.send("reference="+escape(oRecord);

Utilise la console d'erreur de ton navigateur, ça permet de voir rapidement ce genre d'erreur.
Merci à toi, jo_link_noir !
L'erreur de syntaxe que tu m'as trouvée est corrigée,

Par contre, mon script ne me donne toujours pas le résultat escompté !

Pouvez-vous m'aider ?
D'avance, merci.
Modifié par jytest (03 Jan 2013 - 11:51)
Grand merci (...) pour la doc !

Mais je n'en sors pas non plus avec la console...
Elle ne m'est pas de beaucoup d'utilité...

D'où mon appel à l'aide !
Je te dit ça car l'erreur suivante est bateau : variable inexistante dans la fonction detailon. detailon(id) au lieu de detailon(requete) ?
Les erreurs de ce type son très facile à corrigé, pas besoin de faire une demande d'aide.
Sorry !!!

Je n'avais pas mis mon code à jour ici !
Suivant tes conseils, j'avais déjà corrigé cette erreur via la console !

Mais, j'ai "undefined" qui s'affiche !
Pourquoi ?
Modifié par jytest (04 Jan 2013 - 11:05)
Un très grand merci pour ton aide...

Et en modifiant un peu mon ajax...
j'y suis arrivé !!!


	session_start();

	date_default_timezone_set('Europe/Brussels');

	require_once("connexionMysql.inc.php");

	$retour = "";
	if (isset($_REQUEST['reference'])) {
		$query = mysql_query("SELECT * FROM data".
			" WHERE reference=".$_REQUEST['reference']);
		$back = mysql_fetch_assoc($query);

		$retour .= "Voici la pureté :<br>";
		$retour .= trim($back['purete']);
	}




	echo $retour;
	
	mysql_free_result($back);
	mysql_close($connexion);

Modifié par jytest (03 Jan 2013 - 19:39)
Sujet clos
Aller à