é da un pò di tempo che ho intenzione di fare un tutorial su Mootools, il compatto framework javascript creato da italiani.
Lo uso già da diversi mesi al posto del più blasonato Prototype.
Questo semplice tutorial farà in modo che possiate fare un post di un form tramite ajax (senza refresh della pagina) , utilizzando mootools, senza stare a bestemmiare dietro a javascript (e agli errori incomprensibili di IE) :D.
Una volta scaricato dal sito ufficiale (se si ha in progetto un sito di grande dimensione consiglio il pacchetto completo), è sufficiente includerlo nella pagina.
1) Creiamo un nuovo file e chiamiamolo index.html e tra i tag head inseriamo:
<script src="js/mootools.js" type="text/javascript"></script> <script type="text/javascript"> function sendForm(idform,idreport){ //funzione richiamata al momento del click sul tasto send $('test_send').send( {update:$(idreport)}); } </script>
2) Ora prepariamo un piccolo form per fare un test sempre dentro index.html, il form deve avere l’action a un file diverso, il contenuto di quel file sarà poi visualizzato sopra il form.
<div id="report"> </div> <form action="salutami.php" method="post" id="test_send"> <input value="Scrivi il tuo nome" name="tuonome" type="text" /> <input value="send" onclick=" sendForm('test_send','report') " type="button" /> </form>
Nella pagina salutami.php andiamo a copiare il codice php (in realtà si può usare qualsiasi linguaggio) che vogliamo eseguire tramite chiamata asincrona, ricordiamoci inoltre che tutto ciò che sarà stampato a video (tramite echo) sarà visibile all’interno del div con id “report”.
3) Creiamo quindi il file salutami.php e inseriamo il seguente codice:
$nome = $_REQUEST[tuonome]; echo "Ciao $nome";
Ok abbiamo fatto ora basta aprire la pagina e se è andato tutto bene in report apparirà:
Ciao TuoNOME
La prossima volta vedremo come inviare dati da codice e non partendo da form.
(3 voti, media: 4.33 su 5)
Loading ...
Loading ...
September 8th, 2007 at 6:46 pm
Bookmarked.
September 14th, 2007 at 10:07 am
bel tutorial, mi garba che in italiano una persona si prenda cura di insegnare ai neofiti della programmazione come il sottoscritto
September 14th, 2007 at 3:51 pm
Complimenti per il blog e per il tutorial, concordo con te quando affermi che MooTools è un prodotto ottimo e che piano piano rosicchierà fette di utenti a Prototype.
Un Saluto
Francesco
October 23rd, 2007 at 11:30 am
Ciao, ottimo tutorial…concordo su Mootool, è un ottimo framework.
Un domanda.. come si prendono i dati gestiti asincroni e si buttano in un db? continuo a trovare esempi di come farli visualizzare in una pagina in maniera asincrona (senza refresh appunto) ma non trovo nessuno che porta esempi ajax su come il tutto vada a finire poi in un db… sai aiutarmi?
October 23rd, 2007 at 11:43 am
Trovato da solo!!
.. ma è veramente sufficente prendere il dato che arriva a salutami.php e scriverlo nel db? la scrittura del dato viene effettivamente fatta in modo asincrono? scusa le varie domande ma mi sto esaltando man mano che vado avanti con ajax sti giorni!
Ciao
November 8th, 2007 at 8:42 pm
ciao a tutti. vorrei trovare il sistema per inserire in una pagina un testo txt e fare in modo che si aggiorni automaticamente ogni tot secondi, magari usando ajax.
come posso fare?
qualcuno mi saprebbe aiutare o indicare qualche script utile? grazie!
edo
November 9th, 2007 at 12:37 am
@2dispari: si basta infilarlo nel db tramite php o altro linguaggio simile
@edoluz: puoi usare setInterval(\’getTXTWithAjax()\’,2000); chiama la funzione getTXTWithAjax() ogni 2000 secondi
November 9th, 2007 at 1:06 pm
ciao never!
dato che sono proprio un niubbo… mi sapresti indicare i passi fondamentali per fare tutto questo? ti ringrazio per la cortesia e disponibilità!!!