2014-05-23 2 views
0

J'apprends AJAX et XML ces jours-ci. Récemment, j'ai rencontré un problème stupide.Impossible d'exécuter xmlHttp.responseXML sur un serveur local

Je tente de construire un programme simple qui va me montrer dans un <div> tout ce que je saisis dans une boîte de saisie. Pour une raison quelconque, lorsque j'essaie d'utiliser la propriété .responseXML, mon programme ne s'exécute pas. Notez que quand j'utilise le .responseText tout fonctionne bien.

mon code html:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
     <title>Untitled Document</title> 
     <script type="text/javascript" src="foodstore.js"></script> 
    </head> 
    <h3> the chuff bucket </h3> 
    <body onload="process()"> 

     <input type="text" id="userInput"/> 
     <div id="underInput"></div> 
    </body> 
</html> 

mon code php:

<?php 
header('Content-Type: text/xml'); 
echo '<?xml version="1.0" encoding="UTF-8" standalone="yes" ?>'; 
echo '<response>'; 
$food=$_GET['food']; 
echo $food; 
echo '</response>'; 
?> 

mon code js:

// JavaScript Document 
var xmlHttp= createXmlHttpRequestObject(); 



function createXmlHttpRequestObject(){ 
    var xmlHttp; 


    if(window.ActiveXObject){ 
     try{ 
      xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); 
     }catch(e){ 
      xmlHttp = false; 
    } 


    } else { 
     try{ 
      xmlHttp = new XMLHttpRequest(); 
     }catch(e){ 
      xmlHttp = false; 
     } 
    } 

    if(!xmlHttp){ 
     alert("cant create object"); 
    }else{ 
     return xmlHttp; 
    } 
} 



function process(){ 
    var x = xmlHttp.readyState 
    if(xmlHttp.readyState==0||xmlHttp.readyState==4){ 

     food = encodeURIComponent(document.getElementById("userInput").value) 
     xmlHttp.open("GET","foodstore.php?food=" + food , true); 
     x=xmlHttp.readyState; 
     xmlHttp.onreadystatechange= handleServerResponse; 
     xmlHttp.send(null); 

    }else{ 
     setTimeout('process()',1000); 
    } 
} 


function handleServerResponse(){ 

    if(xmlHttp.readyState==4){ 
     if(xmlHttp.status==200){ 

     var xmlResponse= xmlHttp.responseXML; 
      root = xmlResponse.documentElement; 
      alert(root.firstchild); 
      //message= root.firstChild.data; 

      document.getElementById("underInput").innerHTML= '<span  style="color:blue">' + xmlResponse + '</span>'; 
      setTimeout('process()', 1000); 
     }else{ 
      alert('not working'); 
     } 
    } 
} 

Merci à Les assistants.

Répondre

0

Avez-vous essayé avec jQuery? Cela peut être plus facile à faire. Vous pouvez spécifier le type de données

function ajaxJQueryRequest(url,afterReqFunction){ 
    var request = $.ajax({ 
     url: url, 
     type: "GET", 
     crossDomain: true, 
     dataType: "xml" 
     }); 
    request.done(function(msg) { 
      afterReqFunction(msg); 
     }); 
    request.fail(function(jqXHR, textStatus) { 
     alert("Request failed: " + textStatus); 
     }); 
} 
+0

Merci, mais je veux le faire à ma guise parce que je veux apprendre étape par étape ... – misha312

+0

Dans handleServerResponse() essayer de faire: console.log (xmlHttp.responseXML); et dites-nous ce que c'est la console – user3667931

0

Ok Je pense avoir trouvé le bogue. je suis entré dans l'URL du fichier php (que l'envoi de la réponse au html) et a obtenu l'erreur suivante: « Cette page contient les erreurs suivantes:

erreur sur la ligne 2 à la colonne 6: déclaration XML autorisée uniquement à le début du document "

après avoir supprimé l'espace vide en haut de mon php j'ai reçu une nouvelle erreur, après avoir corrigé la nouvelle erreur tout a fonctionné comme un charme ... merci beaucoup !!

Questions connexes