• A
    User Attivo •

    Ajax - scriptaculous primo approccio

    Ciao a tutti
    Da tempo mi sono ripromesso di mettermi a studiare ajax per bene.
    Purtroppo il tempo non l'ho ancora trovato, ma un cliente, mi ha gia chiesto una pagina amministrativa con varie funzioni tutte su una pagina.

    Mi spiego meglio:
    ho una pagina in cui mostro una serie di checkbox che rappresentano delle caratteristiche, sotto una form che permette di aggiungere caratteristiche.

    Quindi:
    una form che invia i dati al php che fa la query e salva i dati nella tabella caratteristiche e un div che fa una richiesta a php e nel momento in cui vede che sono stati salvati nuovi dati, rilegge tutta la tabella.

    Per fare questo ho pensato a scriptacoulus. Inizialmente ho usato solamente ajax.updater che salvava i dati e aggiornava il div, pero alla prima visualizzazione della pagina il div non appariva...
    Cosi ho aggiunto nel div una ajax request che mostra i dati al primo avvio, ma temo non si accorga di quando aggiornao la tabella.

    Oltretutto, in qualche modo il tutto sembra funzionare su firefox, mentre explorer mostra il div vuoto per circa i primi 20 min, poi mostra tutti i checkbox impaginati a caso.

    Mi sa che qualcosa mi sfugge...
    Vi posto un po di codice...

    [HTML]
    <script src="../ajax/prototype.js"></script>
    <script src="../ajax/scriptaculous.js" type="text/javascript"></script>

    <script type="text/javascript">
    new Ajax.Request('caratteristiche.php',
    {
    method:'get',
    onSuccess: function(transport){
    var response = transport.responseText || "no response text";

    e = document.getElementById("changeme");
    e.innerHTML = response;
    },

    onFailure: function(){ alert('Something went wrong...')}

    });

    </script>
    <div id="changeme">

    </div>

    <form id="myform" action="caratteristiche.php" method="post" onsubmit="return false;">
    <input name="caratteristica" type="text" id="caratteristica" size="50" maxlength="250" />
    <input type="button" value="Aggiungi caratteristica" onclick="$('changeme').innerHTML = 'Refreshing...'; new Ajax.Updater('changeme', 'caratteristiche.php', {asynchronous:true, parameters:Form.serialize('myform')});$('myform').reset();$('caratteristica').activate();return false;" />
    </form>
    [/HTML]

    Esistono degli esempi un po piu completi e concreti di quelli della documentazione di scriptacoulus?

    Sono estremamente dettagliate e precise le descrizioni delle funzioni, ma per uno alle prime armi come me è un incubo metterle assieme.

    0
  • A
    User Attivo •

    OOps...

    Ho trovato un errore nelle tabelle, ora funziona al primo avvio in ie e firefox, pero se aggiorno la pagina in ie scompare tutto...

    Ho letto in giro che ie ha tipo una cahe che con diverse chiamate allo stesso file ricorda un po troppe cose ed ho aggiunto un escape nella ajax request

    [HTML]
    var r = Math.random();
    new Ajax.Request('caratteristiche.php?rand="+escape(r)',
    [/HTML]

    però non gli interessa molto e continua a sparire qundo aggiorno.

    La form invece funziona, aggiunge i dati in tabella e aggiorna il div

    0
  • A
    User Attivo •

    Virgolette maledette... adesso sembra funzionare... grazie a tutti lo stesso

    0
  • M
    ModSenior •

    ciao alebal e benvenuto nel Forum GT.

    Per la mia esperienza con Ajax ti dico che Firebug e Web developer toolbar per Firefox assieme a jslog sono indispensabili se vuoi lavorare agilmente.

    0
  • A
    User Attivo •

    Grazie,
    per ora li ho scaricati e ci ho capito poco... ma adesso me li guardo con calma

    0
Effettua l'accesso per rispondere