11489 sujets

JavaScript, DOM et API Web HTML5

[Résolu] Ajax : Undefined index - passage de variable Ajax et Php

Bonjour,
J'ai regardé déjà pas mal de post sur le forum mais je n'arrive toujours pas à trouver mon erreur. Alors je demande un peu d'aide ^^.
Mon problème est que quand j'envoie un message en ajax à un fichier php, je n'arrive pas à le récupérer.

Voici mon code Html :

<html>
<head>
<script src="jquery-1.4.2.js" type="text/javascript"></script>
<script src="ajax.js" type="text/javascript"></script>
</head>

<body>
<div id="lecteur">
</div>

<div id="vignette">
<ul id="thumbs"> 
  <li> 
<a href="videos/video.flv"> coucou
    </a> 
  </li> 
  <li> 
<a href="videos/video.flv"> toutou
    </a> 
  </li> 
</ul>
</div>

<script>
	 var settings = { 
    thumbListId: "thumbs"
  }; 
    var thumbLinks = $("#"+settings.thumbListId).find("a");
  
thumbLinks.click(function(e){ 
	var event = e || window.e;
	if (event.preventDefault) {
   		event.preventDefault(); 
	}
   event.returnValue = false;
	var $this = $(this), 
    target = $this.attr("href"); 
	ajaxvideo(target);
  }); 
</script>
</body>
</html>


Voici mon fichier ajax.js


function getXhr() {
	var xhr = null;
	if(window.XMLHttpRequest)
	xhr = new XMLHttpRequest();
	else if(window.ActiveXObject){
		try {
			xhr = new ActiveXObject("Msxml2.XMLHTTP");
		} catch (e) {
		xhr = new ActiveXObject("Microsoft.XMLHTTP");
		}
	} else {
		alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
		xhr = false;
	}
	return xhr;
}
	
function ajaxvideo(name)
 {
  var xhr = getXhr();

  // Creation de l'objet XMLHttpRequest
  xhr.onreadystatechange = function()
   {
    if(xhr.readyState == 4 && xhr.status == 200)
     {
      document.getElementById('lecteur').innerHTML = xhr.responseText;
     }
   }
  xhr.open("POST",'ajaxvideo.php',true);
  xhr.setRequestHeader('Content-Type','x-www-form-urlencoded');
  var data="value="+name;
  //alert("Val envoyée: "+data);
  xhr.send(data);
 }



et enfin mon fichier ajaxvideo.php : 

<?php
if(!isset($_POST['value']))
	echo "<p>vide</p>";
$value = $_POST['value'];
echo "<p> test : $value</p>";
?>


Lorsque je clique sur un des liens voici le résultat :

vide
Notice: Undefined index: value in C:\wamp\www\testajax\ajaxvideo.php on line 4
test :

Pour moi il est clair qu'aucun message n'est envoyé au fichier ajaxvideo.php cependant il arrive à afficher "vide" ce qui montre qu'il a réussi à ouvrir le fichier.

Merci d'avance pour votre aide.
Modifié par Wyatt (18 Aug 2010 - 13:47)
J'avoue que je suis bluffé, ça marche et finalement, c'est pas compliqué.

Voici mon code : 


<html> 
<head> 
<script src="jquery-1.4.2.js" type="text/javascript"></script> 
<script src="ajax.js" type="text/javascript"></script> 
</head> 
 
<body> 
<div id="lecteur"> 
</div> 
 
<div id="vignette"> 
<ul id="thumbs">  
  <li>  
<a href="videos/video.flv"> coucou 
    </a>  
  </li>  
  <li>  
<a href="videos/video.flv"> toutou 
    </a>  
  </li>  
</ul> 
</div> 
 
<script> 
    var thumbLinks = $("#thumbs").find("a"); 
   
thumbLinks.click(function(e){  
    var event = e || window.e; 
    if (event.preventDefault) { 
           event.preventDefault();  
    } 
   event.returnValue = false; 
    var $this = $(this),  
    target = $this.attr("href"); 
    $.ajax({
   		type: "POST",
   		url: "ajaxvideo.php",
		data: "value="+target,
   		error:function(msg){
     	alert( "Error !: " + msg );
   },
   success:function(data){
   	//affiche le contenu du fichier dans le conteneur dédié
	document.getElementById('lecteur').innerHTML = data;
	}});
  });  
</script> 
</body> 
</html>


le code php reste le même : 


<?php 
if(!isset($_POST['value'])) 
    echo "<p>vide</p>"; 
$value = $_POST['value']; 
echo "<p> test : $value</p>"; 
?>


j'ai ainsi supprimé mon fichier ajax.js.
Merci pour l'aide Smiley smile
Modifié par Wyatt (18 Aug 2010 - 13:54)
Sujet clos
Aller à