Controllare in tempo reale se una username esiste

In questo tutorial andremo a scoprire come creare una formche vada a controllare, tramite AJAX, se un username ègià in uso da un altro utente. Il codice, integrato inuna form di registrazione, risulterà particolarmenteutile perchè permetterà a colui che si vuoleregistra di sapere se l' username da lui scelto ègià in uso da un altro utente.

Come prima cosa va costruita la pagina ASP(usercheck.asp) incaricata di effettuare il controllodinamico; dovrò ricevere un parametro (GET)"username" e mostrare un messaggio nel caso in cuisia o non sia già presente nel database deiregistrati:

'se c'è uno spazio nell' username, viene dato come invalido    if InStr(request("username")," ") then  response.write "No spazi nell' username."    else'connessione al database ed operazioni su di essodim strConn, dbConn, RS'...impostare la stringa di connessione al DB  dbConn.open(strConn) 'query al database  set RS = dbConn.execute("SELECT count(*) AS cnt FROM blog_comment " &_  "WHERE username = " & request.querystring("username"))'controllo se è preso o no  if RS("cnt") > 0 thenresponse.write "Scusa, " & request.querystring("username") &_   " è già in uso da un altro utente."elseresponse.write "" & "Congratulazioni  " & request.querystring("username") &_   " è disponibile!."  end if    end if

Come si potrà notare, ci sono 3 possibili rispostesupportate dallo script.

Cosa successiva da fare è la scrittura di una funzioneajax.js:

// va richiamata all' input nella textbox// aprirà la pagina usercheck.asp inviandole // l' username che l' utente vuole utilizzarefunction sndUserCheck(action){     http.open("get" , "usercheck.asp?username="   + action);     http.onreadystatechange = handleResponse;     http.send(null);}

Ogni volta che tal funzione viene chiamata, invieràuna XMLHttpRequest ad usercheck.asp contenente l'username scelto dall' utente.

Infine, ecco il codice relativo all' interfaccia dellapagina:

<HTML><TITLE>Controllo username in AJAX</TITLE><!-- Funzioni AJAX --><script type="text/javascript" src="ajax.js"></script><BODY><form name="FormAccount"> <input type="text" id="formUserName"   name="formUserName">    <input type="button" value="Check"   onclick="sndUserCheck(document.FormAccount.formUserName.value);"></form>    <br><br><div id="TakenOrNot"></div></BODY></HTML>

La pagina, come si può intendere da sopra, avràun campo di testo nel quale l' utente può inserirel' username che vorrebbe usare, avrà un bottoneche darà avvio al controllo ed un oggetto div chemostrerà la risposta. Da notare che l' inputdell' utente viene recuperato in questo modo:

document.FormAccount.formUserName.value

 



Ti potrebbe interessare anche

commenta la notizia