Ciao a tutti,
Mi sto dando da fare per imparare e già riesco a combinare e capire qualcosina di php/js(ajax,json), ma mi rendo conto che ho ancora tanta strada da percorrere e problemi grandi e meno grandi da affrontare, questo che sto per illustravi ad esempio non so manco come classificarlo, fatto delle ricerche generiche ma non sapevo nemmeno cosa scrivere nel titolo.
Vorrei che il risultato della richiesta ajax comparisse dentro un div nella pagina index, ma nonostante il corretto funzionamento del form se aperto singolarmente, una volta che lo richiamo dal link il form non funziona e mi ritorna il "POST" sulla barra d'indirizzo come fosse stato inviato tramite "GET".
Questa "applicazione" dovrebbe cambiare colore allo sfondo dipendendo della scelta impostata, questo è un mero esempio, vorrei che dall'inizio alla fine il tutto si concentrasse sul un div senza cambiare pagina (index.php).
Ho cercato di riprodurre il problema in un modo semplice. Spero di aver reso l'idea.
Ora il codice:
index.php
navig.htmlCodice PHP:<?php ?> <html> <head> <title>index</title> </head> <body> <div id='result0'> <?php include ('navig.html'); ?> </div> </body> </html>
form.htmlcodice:<html> <head> <title>navigbar</title> <script> function GetXMLHttp() { if(navigator.appName == "Microsoft Internet Explorer") { xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); } else { xmlHttp = new XMLHttpRequest(); } return xmlHttp; } var xmlRequest = GetXMLHttp(); function aprePag(valore){ var url = valore; xmlRequest.open("GET",url,true); xmlRequest.onreadystatechange = cambiaStato; xmlRequest.send(null); if (xmlRequest.readyState == 1) { document.getElementById("result0").innerHTML = "caricando..."; } return url; } function cambiaStato(){ if (xmlRequest.readyState == 4){ document.getElementById("result0").innerHTML = xmlRequest.responseText; } } </script> </head> <body> <div id='result1'> <h3>Clicca per accedere al form</h3> </div> </body> </html>
colore.phpcodice:<html> <head> <title>Form_test</title> <Script src="http://code.jquery.com/jquery-1.6.2.min.js" type="text/javascript"></Script> <script > $(document).ready(function() { $("#form_id").submit(function(){ var querystring = $(this).serializeArray(); $.post("colore.php", querystring, function(data) { $('#result2').html(data); //alert(data); }); return false; }); }); </script> </head> <body> <div id="result2"> <form action="#" id="form_id" accept-charset='UTF-8'> <div><input type='radio' name='colore' id='RadioGroup1_radio_0' value='red'/><label>Rosso</label></div> <div><input type='radio' name='colore' id='RadioGroup1_radio_1' value='green'/><label>Verde</label></div> <h4>Scegli un colore e una tonalita</h4> <div><input type='radio' name='tono' id='RadioGroup2_radio_0' value='molto'/><label>Scuro</label></div> <div><input type='radio' name='tono' id='RadioGroup2_radio_1' value='poco'/><label>Chiaro</label></div> <input type='submit' name='submit' value="invia"/> </form> </div> </body> </html>
Grazie per l'attenzione.Codice PHP:<html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <script> </script> <title>test_post</title> </head> <body> <?php $colore = $_POST["colore"]; $tono = $_POST["tono"]; if (($colore == 'red') AND ($tono == 'poco')) { $back = "#FF8888";} elseif ($colore == 'red' AND $tono == 'molto') { $back = "#F00000";} if ($colore == 'green' AND $tono == 'poco') { $back = "#B7FFB7";} elseif ($colore == 'green' AND $tono == 'molto'){ $back = "#006C00";} ?> <div style="background-color:<?php echo $back; ?>; color:yellow; text-align:center"><h1>TEST COLORE</h1></div> </body> </html>
Rispondi quotando
