Alhazred
07-03-2010, 10:17
Per un mio sito ho realizzato uno script in php che genera un captcha, per fare in modo che l'utente possa cambiarlo in caso non sia leggibile ho inserito un pulsante, ma questo al momento fa semplicemente il refresh dell'intera pagina.
Io vorrei fare in modo invece che avvenisse una cosa di questo tipo al click del pulsante:
- viene inviata una richiesta alla pagina php contenente lo script per la generazione dell'immagine captcha
- nella pagina visualizzata cambia solo l'immagine, inserendo quella nuova generata dallo script
Premesso che sono agli inizi con AJAX, ci sto provando ma non ci riesco.
Il pulsante è così
<input type="button" name="invia" value="Cambia codice" onclick="changeCode()" />
L'immagine si trova in una cella di una tabella ed è così impostata
<img id="code" src="captcha.php" alt="codice"/>
Per quanto riguarda la funzione, all'inizio, avevo provato semplicemente a richiamare l'attributo src in questo modo
document.getElementById("code").src = 'captcha.php';
oppure a mettere un div contenente l'immagine, in questo modo
<div id="code">
<img src="captcha.php" alt="codice"/>
<div>
e cambiare l'innerHTML del div riscrivendo completamente il tag <img> in questo modo
document.getElementById("code").innerHTML = '<img src="captcha.php" alt="codice"/>';
Ovviamente non ha funzionato nessuna delle due soluzioni, altrimenti non sarei qui.
Qual è il modo corretto per fare ciò che vorrei?
Io vorrei fare in modo invece che avvenisse una cosa di questo tipo al click del pulsante:
- viene inviata una richiesta alla pagina php contenente lo script per la generazione dell'immagine captcha
- nella pagina visualizzata cambia solo l'immagine, inserendo quella nuova generata dallo script
Premesso che sono agli inizi con AJAX, ci sto provando ma non ci riesco.
Il pulsante è così
<input type="button" name="invia" value="Cambia codice" onclick="changeCode()" />
L'immagine si trova in una cella di una tabella ed è così impostata
<img id="code" src="captcha.php" alt="codice"/>
Per quanto riguarda la funzione, all'inizio, avevo provato semplicemente a richiamare l'attributo src in questo modo
document.getElementById("code").src = 'captcha.php';
oppure a mettere un div contenente l'immagine, in questo modo
<div id="code">
<img src="captcha.php" alt="codice"/>
<div>
e cambiare l'innerHTML del div riscrivendo completamente il tag <img> in questo modo
document.getElementById("code").innerHTML = '<img src="captcha.php" alt="codice"/>';
Ovviamente non ha funzionato nessuna delle due soluzioni, altrimenti non sarei qui.
Qual è il modo corretto per fare ciò che vorrei?