problema ajax funzione coloratesto

**nic0tin4** · 13-12-2009, 23:55

Ciao a tutti ragazzi,
ho iniziato da poco a studiare Ajax e stavo facendo qualche prova con questa pagina html che richiama tramite una funzione ajax una pagina php. QUesta pagina dovrebbe servire a passare i tag della pagina php dentro al select e poi poter colorare il testo nel div ma non funzia e non riesco a capire il motivo, qualcuno sa darmi una mano? Vi posto il codice

codice:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>Prova Ajax e Xml</title>
    <script type="text/javascript">
        var options;
        function getOption(schema) {
            if (Ajax.Request) {
            var url = option_3.php;
            Ajax.open("POST",url);
            Ajax.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
            Ajax.onreadystatechange = function(){
                if(Ajax.readyState == 4 && Ajax.status == 200) {
                    var xmlDocument = Ajax.ResponseXML;
                     options = xmlDocument.getElementByTagName('option');
                    listOptions();
                }
                function listOptions(){
                    var i;
                    var selectControl = document.getElementById('optionList');
                    for (i=0; i<options.length; i++){
                            selectControl.options[i] = new Option(options[i].firstChild.data);}
                }

            }
            function setOption(){
                document.getElementById('targetDiv').style.color = options[document.getElementById('optionList').selectedIndex].firstChild.data;
            }
            Ajax.send("schema="+schema)
            }
        }
    </script>

  </head>
  <body>
      <h4>ajax e xml</h4>
      <form id="prova">
          <select id="optionList" size="1" onchange="setOption();">
              <option>seleziona i colori</option>
          </select>
          <input type="button" value="clicca" onclick="getOption(1);" />
      </form>
      <div id="targetDiv">
          Colora il testo
      </div>
  </body>
</html>

**artorius** · 14-12-2009, 13:28

ma... e la variabile Ajax dove la definisci?

**nic0tin4** · 14-12-2009, 15:17

Devo fare tipo var Ajax = new Ajax.request???

**artorius** · 14-12-2009, 15:20

no, decisamente, no, dove hai preso esempio non c'era qualche file esterno che definiva l'oggetto XMLHttpRequest?

**nic0tin4** · 14-12-2009, 15:22

no l'esempio l'ho preso dal libro ajax for dummies....

**artorius** · 14-12-2009, 15:27

eccolo... allora, cercati cos'è l'oggetto XMLHttpRequest e come si usa.

**nic0tin4** · 14-12-2009, 15:40

ok grazie, mi sono letto ,la guida che sta su html.it quindi per firefox per utilizzare l'oggetto basta che lo definisco cosi? Ajax = new XMLHttpRequest()

**artorius** · 14-12-2009, 16:08

esatto, ma su explorer 6 lo devi definire in modo diverso, datti una lettura a http://www.w3schools.com/XML/xml_http.asp

**nic0tin4** · 14-12-2009, 16:14

ok ma nella mia funzione dove lo devo definire? perche l'ho fatto ma non funziona lo stesso....per adesso voglio provare solo con firefox....perche voglio capire come passa le variabili tra le pagine....

**nic0tin4** · 16-12-2009, 11:27

ciao ho modificato il codice per fare delle prove con responseXML, anzi ho preso il codice di una prova che ha fatto un utente nel forum facendo una ricerca ma non mi funziona come mai???? cosa sbaglio??? Ve lo posto

codice:

<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        
        <title></title>
		<script type="text/javascript" language="javascript" src="prototype.js"></script>
		 <script type="text/javascript">
			 function getOption() {
			 
			 var ajaxRequest;
       
            // Opera 8.0+, Firefox, Safari
            ajaxRequest = new XMLHttpRequest();

			ajaxRequest.onreadystatechange = function() {
				if(ajaxRequest.readyState == 4) {
					if(ajaxRequest.responseXML) {
						alert('onreadyState == 4');
						var xmlDoc = ajaxRequest.responseXML;
						var option = xmlDoc.getElementByTagName("option");
						alert(option.length);
					}
				}

   
      
			}
        ajaxRequest.open("GET", "option_3.php", true);
        ajaxRequest.setRequestHeader("content-type", "application/x-www-form-urlencoded");
        ajaxRequest.send(null);
	}
</script>

	</head>
    <body>
         <h4>ajax e xml</h4>
      <form id="prova">
          <select id="optionList" size="1">
              <option>seleziona i colori</option>
          </select>
          <input type="button" value="clicca" onclick="getOption();"  />
      </form>
      <div id="targetDiv">
          bla bla
      </div>
    </body>
</html>

e il file php che stampa l'xml è questo

codice:

<?
header('Content-type:text/xml');
echo "<?xml version=\"1.0\"?>";
echo "<options>";
echo "<option>"."red"."</option>";
echo "<opzione>"."rosso"."</opzione>";
echo "</options>";
?>

Grazie a Tutti!!!

Discussione: problema ajax funzione coloratesto

Strumenti discussione

Ricerca discussione

Visualizza

problema ajax funzione coloratesto

Permessi di invio