Solució exercici4-ajax
De wikiserver
La revisió el 18:15, 3 abr 2014 per Asalinas (Discussió | contribucions) (Es crea la pàgina amb «Fitxer PHP (usuaris.php): <pre> <?php function valida($nom){ $fitxer = fopen("usuarios.txt", "r") or die("El fitxer ha donat error"); $trobat = false; while…».)
Fitxer PHP (usuaris.php):
<?php function valida($nom){ $fitxer = fopen("usuarios.txt", "r") or die("El fitxer ha donat error"); $trobat = false; while(!feof($fitxer) && !$trobat){ if(strcmp(strtoupper(fgets($fitxer)),strtoupper($nom)."\n") == 0){ $trobat = true; } } fclose($fitxer); if($trobat){ $nom2 = $nom.rand(0,9); return valida($nom2); } else{ return $nom; } } function afegeix($nom, $pass){ $fitxer = fopen("usuarios.txt", "a+") or die("El fitxer ha donat error"); fwrite($fitxer,$nom."\n"); fclose($fitxer); return "Guardat correctament"; } function checkRequest(){ if(isset($_REQUEST["command"])){ switch(strtoupper($_REQUEST["command"])){ case "VALIDA" : if(isset($_REQUEST["nom"])){ echo valida($_REQUEST["nom"]); } else{ echo "Falta el paràmetre nom"; } break; case "AFEGEIX" : if(isset($_REQUEST["nom"]) ){ echo afegeix($_REQUEST["nom"]); } else{ echo "Faltan paràmetres"; } break; default: echo "Aquesta funció no existeix"; } } } checkRequest(); ?>
Fitxer javascript (exercici4.js):
var xhr; function peticionAjax(nom, command){ if (window.ActiveXObject) { //Iexplorer xhr = new ActiveXObject("Microsoft.XMLHTTP"); } else if (window.XMLHttpRequest) { //Tots els altres navegadors que soporten ajax xhr = new XMLHttpRequest(); } else { throw new Error("Ajax is not supported by this browser"); } xhr.open('POST', 'usuaris.php'); xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded"); xhr.onreadystatechange = function() { if (this.readyState == 4) { if (this.status >= 200 && this.status < 300) { if (command.toLowerCase() == "valida"){ if(nom == this.responseText){ document.getElementById("btn").disabled=false; } else{ document.getElementById("nomValidat").innerHTML = this.responseText; } } else{//funcion afegeix de php document.write(this.responseText); } } } } var content = "command=" + command + "&nom=" + nom; xhr.send(content); } function inici(){ document.getElementById("usuarios").onblur = function(){ peticionAjax(this.value, "valida"); } document.getElementById("btn").onclick=function(){ peticionAjax(document.getElementById("usuarios").value, "afegeix"); } } window.onload = inici;
Fitxer html (index.html):
<!DOCTYPE html> <html> <head> <title></title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <script type="text/javascript" src="exercici4.js"></script> </head> <body> <input type="text" id="usuarios" /> <div id="nomValidat" style="color:green;"></div> <input type="password" id="usuarios" /> <input type="button" id="btn" value="enviar" disabled="disabled"/> </body> </html>