[AJAX] Verifica disponibilità username

Fede 88 · 01-11-2009, 19:32

In teoria la verifica disponibilità username è già stata fatta, però com'è ora visualizza l'eventuale messaggio di errore in una nuova pagina.

Quello che sto cercando di fare è, al evento onblur della form username, esequire la query php che controlla la disponibilità per poi visualizzare nella stessa pagina, se il nome utente scelto è disponibile, il tutto di fianco alla form.
Ho cercato e trovato un po' di guide che spiegano come fare, però in ogni guida c'è sempre un file javascript che occupa un bel po' di KB (80-90-120) con al suo interno righe e righe di codice incapibile (almeno per me).
E' possibile che non c'è un modo più semplice per farlo? Qualcuno sa dirmi dove posso trovare una buona guida, oppure in alternativa anche spiegarmelo direttamente se non è troppo lungo.

Grazie. Mi affido a voi...

ndakota · 01-11-2009, 23:30

E' normale, c'è bisogno di javascript per farlo.

Fede 88 · 02-11-2009, 11:09

Ok, che c'è bisogno di javascript lo so, però quello che non capisco è perchè c'è tutta questa differenza. Cioè per visualizzare la stessa scritta in una nuova pagina ho fatto poche righe di codice, mentre per visualizzarlo nella stessa pagina dovrei avere un file di centinaia di righe di codice.

MEMon · 02-11-2009, 11:21

http://antirez.com/articoli/spaghettiajax.html lì è scitto abbastanza bene.

Fede 88 · 02-11-2009, 22:06

Grazie, provo a vedere cosa riesco a combinare poi ti faccio sapere come va.

nico159 · 02-11-2009, 22:26

jQuery

malocchio · 03-11-2009, 00:49

Quote:

Originariamente inviato da nico159

jQuery

Ed io aggiungerei: come minimo!
E' abbastanza da incoscienti buttarsi sull'ajax senza un minimo di framework che assicuri compatibilità e facilità di utilizzo.
La versione minimizzata di jQuery si trova a poche decine di kB. E' ovviamente consigliato linkare al file hostato da google..

Fede 88 · 03-11-2009, 10:05

Io adesso sto provando l'esempio del link, ci sono ancora degli errori da correggere, infatti quando premo controlla il browser mi dice: Error on page

Pagina html:

Codice:

<HTML>
<HEAD>
<TITLE>CONTROLLO</TITLE>
<script language="Javascript" type="text/javascript">
<!--
var myRequest = null;

function CreateXmlHttpReq2(handler) {
  var xmlhttp = null;
  try {
    xmlhttp = new XMLHttpRequest();
  } catch(e) {
    try {
        xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
    } catch(e) {
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
  }
  xmlhttp.onreadystatechange = handler;
  return xmlhttp;
}

function myHandler2() {
    if (myRequest.readyState == 4 && myRequest.status == 200) {
        e = document.getElementById("ex4result");
        e.innerHTML = myRequest.responseText;
    }
}

function esempio4() {
    var nome = document.f1.username.value;
    var r = Math.random();
    myRequest = CreateXmlHttpReq(myHandler2);
    myRequest.open("GET","check_user.php?username="+escape(nome)+"&rand="+escape(r));
    myRequest.send(null);
}
-->
</script>
</HEAD>
<BODY>
<form name="f1">
<input type="text" name="username" style="width: 230px"/><br><input type="button" onClick="esempio4()" value="Controlla dispo" />
<DIV id="ex4result" STYLE="position:absolute; border-style:solid; border-width:1; border-color:black; width:200px; color:black; background-color:white"></div>

<br>
<input type="text" name="password" style="width: 230px"/>
</form>
</BODY>
</HTML>

Pagina php:

Codice:

<?php

include("connessioneDB.php");

// Se la variabile username è stata settata allora...
if (!isset($_GET['username'])) { echo "Username non inserito";
  else
    {
      $username = $_GET['username'];
      $query = "SELECT username FROM utenti WHERE username = '$username'"; 
      $ris = mysql_query($query, $db); 
      $ris = mysql_num_rows($ris); 
      if($ris != '0') { echo "Username già in uso" }
        else { echo " Username disponibile" }
?>

Fatemi capire... se lo dovessi fare in questo modo, rispetto a farlo utilizzando jQUERY che differenze ci sarebbero?

nico159 · 03-11-2009, 15:21

Con jQuery ti basterebbe

Codice HTML:

  <script src="http://code.jquery.com/jquery-latest.js"></script>
  
  <script>
  $(document).ready(function(){
    $("#elemento").load("/ajax.php");
  });
  </script>

Funzionante su tutti i browser, senza alcun bug

http://docs.jquery.com/Ajax/load

Fede 88 · 03-11-2009, 17:29

Quote:

Originariamente inviato da nico159

Con jQuery ti basterebbe

Codice HTML:

  <script src="http://code.jquery.com/jquery-latest.js"></script>
  
  <script>
  $(document).ready(function(){
    $("#elemento").load("/ajax.php");
  });
  </script>

Funzionante su tutti i browser, senza alcun bug

http://docs.jquery.com/Ajax/load

Quei file sono di libero utilizzo?

malocchio · 03-11-2009, 22:31

Quote:

Originariamente inviato da Fede 88

Quei file sono di libero utilizzo?

Ovvio!

Fede 88 · 04-11-2009, 08:29

Ok grazie, però non ho capito un'altra cosa.
Quei file li salvo e basta o vanno modificati e adattati in base alle esigenze?

MEMon · 04-11-2009, 11:28

jquery è un framework, quindi possiede tante funzionalità(delle quali la maggior parte non ti verrà nemmeno in mente di usare) che ti fanno risparmiare tempo.

Se ti interessa capirci un minimo di javascript ti consiglio iniziare ad usare un framewrok quando già sai come fare le cose, e sei consapevole che sprechi del tempo a riscrivere sempre le stesse cose.

Il codice che hai postato sembra corretto, se dici di preciso in che riga viene l'errore ti possiamo aiutare, sempre se ti interessa ancora capirci qualcosa.

Fede 88 · 04-11-2009, 12:37

Si si, il fatto è che non mi da errori sulla pagina, però nella barra in basso del browser (IE), quando premo sul bottone "controlla dispo" mi visualizza il triangolino giallo di errore con scritto a lato: Error on page.

MEMon · 04-11-2009, 12:38

Quote:

Originariamente inviato da Fede 88

Si si, il fatto è che non mi da errori sulla pagina, però nella barra in basso del browser (IE), quando premo sul bottone "controlla dispo" mi visualizza il triangolino giallo di errore con scritto a lato: Error on page.

Se ci clicchi dovrebbe aprirsi una finestrella con i dettagli dell'errore...

Fede 88 · 04-11-2009, 12:50

dice:
Message: Object expected
Line: 33
Char: 5
Code: 0
URI: http://127.0.0.1/Prove/prova.html

Non capisco il motivo dato che la pagina c'è ed è in quella cartella.

MEMon · 04-11-2009, 12:50

Incollami la riga 33 di quel file.

Fede 88 · 04-11-2009, 13:02

Quote:

Originariamente inviato da MEMon

Incollami la riga 33 di quel file.

Codice:

function esempio4() {
    var nome = document.f1.username.value;
    var r = Math.random();
    myRequest = CreateXmlHttpReq(myHandler2);
    myRequest.open("GET","check_user.php?username="+escape(nome)+"&rand="+escape(r));
    myRequest.send(null);
}

la riga 33 è questa:

Codice:

myRequest.open("GET","check_user.php?username="+escape(nome)+"&rand="+escape(r));

MEMon · 04-11-2009, 13:08

myRequest sembra essere nullo, incollami la funzione CreateXmlHttpReq

Fede 88 · 04-11-2009, 13:12

Codice:

function CreateXmlHttpReq2(handler) {
  var xmlhttp = null;
  try {
    xmlhttp = new XMLHttpRequest();
  } catch(e) {
    try {
        xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
    } catch(e) {
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
  }
  xmlhttp.onreadystatechange = handler;
  return xmlhttp;
}

01-11-2009, 19:32	#1
Fede 88 Senior Member Iscritto dal: Aug 2004 Città: Milano Messaggi: 1310	[AJAX] Verifica disponibilità username In teoria la verifica disponibilità username è già stata fatta, però com'è ora visualizza l'eventuale messaggio di errore in una nuova pagina. Quello che sto cercando di fare è, al evento onblur della form username, esequire la query php che controlla la disponibilità per poi visualizzare nella stessa pagina, se il nome utente scelto è disponibile, il tutto di fianco alla form. Ho cercato e trovato un po' di guide che spiegano come fare, però in ogni guida c'è sempre un file javascript che occupa un bel po' di KB (80-90-120) con al suo interno righe e righe di codice incapibile (almeno per me). E' possibile che non c'è un modo più semplice per farlo? Qualcuno sa dirmi dove posso trovare una buona guida, oppure in alternativa anche spiegarmelo direttamente se non è troppo lungo. Grazie. Mi affido a voi...

02-11-2009, 22:26	#6
nico159 Senior Member Iscritto dal: Aug 2003 Città: Barletta (BA) Messaggi: 939	jQuery __________________ In a world without fences, who needs Gates? Power by: Fedora 8 - Mac OS X 10.4.11

03-11-2009, 15:21	#9
nico159 Senior Member Iscritto dal: Aug 2003 Città: Barletta (BA) Messaggi: 939	Con jQuery ti basterebbe Codice HTML: <script src="http://code.jquery.com/jquery-latest.js"></script> <script> $(document).ready(function(){ $("#elemento").load("/ajax.php"); }); </script> Funzionante su tutti i browser, senza alcun bug http://docs.jquery.com/Ajax/load __________________ In a world without fences, who needs Gates? Power by: Fedora 8 - Mac OS X 10.4.11 Ultima modifica di nico159 : 03-11-2009 alle 15:26.

01-11-2009, 23:30	#2
ndakota Senior Member Iscritto dal: Oct 2006 Città: milano Messaggi: 1439	E' normale, c'è bisogno di javascript per farlo.

02-11-2009, 11:09	#3
Fede 88 Senior Member Iscritto dal: Aug 2004 Città: Milano Messaggi: 1310	Ok, che c'è bisogno di javascript lo so, però quello che non capisco è perchè c'è tutta questa differenza. Cioè per visualizzare la stessa scritta in una nuova pagina ho fatto poche righe di codice, mentre per visualizzarlo nella stessa pagina dovrei avere un file di centinaia di righe di codice.

02-11-2009, 11:21	#4
MEMon Senior Member Iscritto dal: Dec 2002 Messaggi: 3359	http://antirez.com/articoli/spaghettiajax.html lì è scitto abbastanza bene.

02-11-2009, 22:06	#5
Fede 88 Senior Member Iscritto dal: Aug 2004 Città: Milano Messaggi: 1310	Grazie, provo a vedere cosa riesco a combinare poi ti faccio sapere come va.

04-11-2009, 08:29	#12
Fede 88 Senior Member Iscritto dal: Aug 2004 Città: Milano Messaggi: 1310	Ok grazie, però non ho capito un'altra cosa. Quei file li salvo e basta o vanno modificati e adattati in base alle esigenze?

04-11-2009, 11:28	#13
MEMon Senior Member Iscritto dal: Dec 2002 Messaggi: 3359	jquery è un framework, quindi possiede tante funzionalità(delle quali la maggior parte non ti verrà nemmeno in mente di usare) che ti fanno risparmiare tempo. Se ti interessa capirci un minimo di javascript ti consiglio iniziare ad usare un framewrok quando già sai come fare le cose, e sei consapevole che sprechi del tempo a riscrivere sempre le stesse cose. Il codice che hai postato sembra corretto, se dici di preciso in che riga viene l'errore ti possiamo aiutare, sempre se ti interessa ancora capirci qualcosa.

04-11-2009, 12:37	#14
Fede 88 Senior Member Iscritto dal: Aug 2004 Città: Milano Messaggi: 1310	Si si, il fatto è che non mi da errori sulla pagina, però nella barra in basso del browser (IE), quando premo sul bottone "controlla dispo" mi visualizza il triangolino giallo di errore con scritto a lato: Error on page.

04-11-2009, 12:50	#16
Fede 88 Senior Member Iscritto dal: Aug 2004 Città: Milano Messaggi: 1310	dice: Message: Object expected Line: 33 Char: 5 Code: 0 URI: http://127.0.0.1/Prove/prova.html Non capisco il motivo dato che la pagina c'è ed è in quella cartella.

04-11-2009, 13:08	#19
MEMon Senior Member Iscritto dal: Dec 2002 Messaggi: 3359	myRequest sembra essere nullo, incollami la funzione CreateXmlHttpReq

Strumenti
Mostra una versione stampabile Invia questa pagina per email