Visualizzazione dei risultati da 1 a 5 su 5
  1. #1
    Utente di HTML.it L'avatar di allin81
    Registrato dal
    Mar 2011
    Messaggi
    1,875

    scrollare in automatico la pagina dopo l'invio del form con ajax

    Qualcuno avrà visto le mie richieste per capire come aprire il risultato di una ricerca nella stessa pagina tramite ajax.
    Fino a qui tutto ok, ci sono riuscito!
    Ora volevo fare l'ultimo passaggio:
    - una volta cliccato su "cerca" la pagina deve scrollare direttamente fino al div che contiene il risultato di tale ricerca.
    Faccio già qualcosa del genere cliccando su un link e finendo su un ancora con la parola #offerte, ma non capisco come posso fare in modo da farlo anche tramite un form.

    Questo e' il codice che mi fa la ricerca
    codice:
    <form name="form" onSubmit="javascript:xmlhttpPost('ricerca_hotel2.php'); return false;">
    Ho provato a mettere anche ricerca_hotel2.php#offerte ma non fa quello che vorrei.
    C'è qualche soluzione utile?

    Grazie

  2. #2
    Moderatore di Annunci siti web, Offro lavoro/collaborazione, Cerco lavoro L'avatar di cavicchiandrea
    Registrato dal
    Aug 2001
    Messaggi
    26,131
    Al callback della chiamata ajax aggingici location.hash = "nome_ancora"
    Cavicchi Andrea
    Problemi con javascript, jquery, ajax clicca qui

  3. #3
    Utente di HTML.it L'avatar di allin81
    Registrato dal
    Mar 2011
    Messaggi
    1,875
    Il codice è abbastanza lungo, dove dovrei aggiungerlo?
    codice:
    script language="Javascript">
    //Funzione per la gestione asincrona AJAX
    function xmlhttpPost(strURL) {
        //Inizializzo l'oggetto xmlHttpReq
        var xmlHttpReq = false;
        var self = this;
        // qui valutiamo la tipologia di browser utilizzato per selezionare la tipologia di oggetto da creare.
        // Se sono in un browser Mozilla/Safari, utilizzo l'oggetto XMLHttpRequest per lo scambio di dati tra browser e server.
        if (window.XMLHttpRequest) {
            self.xmlHttpReq = new XMLHttpRequest();
        }
        // Se sono in un Browser di Microsoft (IE), utilizzo Microsoft.XMLHTTP 
        //che rappresenta la classe di riferimento per questo browser
        else if (window.ActiveXObject) {
            self.xmlHttpReq = new ActiveXObject("Microsoft.XMLHTTP");
        }
        //Apro il canale di connessione per regolare il tipo di richiesta.
        //Passo come parametri il tipo di richiesta, url e se è o meno un operazione asincrona (isAsync)
        self.xmlHttpReq.open('POST', strURL, true);
        
        //setto l'header dell'oggetto
        self.xmlHttpReq.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
        
        /* Passo alla richiesta i valori del form in modo da generare l'output desiderato*/
        self.xmlHttpReq.send(recuperaValore());
        
        /* Valuto lo stato della richiesta */
        self.xmlHttpReq.onreadystatechange = function() {
                 
                /*Gli stai di una richiesta possono essere 5
                * 0 - UNINITIALIZED
                * 1 - LOADING
                * 2 - LOADED
                * 3 - INTERACTIVE
                * 4 - COMPLETE*/
                
            //Se lo stato è completo    
            if (self.xmlHttpReq.readyState == 4) {
                /*  Aggiorno la pagina con la risposta ritornata dalla precendete richiesta dal web server.
                Quando la richiesta è terminata il responso della richiesta è disponibie come responseText.*/
                aggiornaPagina(self.xmlHttpReq.responseText);
            }
        }
    
    }
    /*Questa funzione recupera i dati dal form.*/
    function recuperaValore() {
        var form     = document.forms['form'];
        var arrivo = form.arrivo.value;
        var durata = form.durata.value;
        var tipo_pacchetto = form.tipo_pacchetto.value;
        var aeroporto = form.aeroporto.value;
        var citta_bus = form.citta_bus.value;
        var id_hotel = form.id_hotel.value;
        //valore = 'arrivo=' + escape(arrivo);
        valore = 'arrivo=' + escape(arrivo) + '&durata=' + escape(durata) + '&tipo_pacchetto=' + escape(tipo_pacchetto) + '&aeroporto=' + escape(aeroporto) + '&citta_bus=' + escape(citta_bus) + '&id_hotel=' + escape(id_hotel);
        return valore;
    }
    /*Questa funzione viene richiamata dall'oggetto xmlHttpReq per l'aggiornamento asincrono dell'elemento risultato*/
    function aggiornaPagina(stringa){
        document.getElementById("risultato").innerHTML = stringa;
    }
    </script>
    L'ancora si chiama #offerte

  4. #4
    Moderatore di Annunci siti web, Offro lavoro/collaborazione, Cerco lavoro L'avatar di cavicchiandrea
    Registrato dal
    Aug 2001
    Messaggi
    26,131
    Prova qui
    function aggiornaPagina(stringa){
    document.getElementById("risultato").innerHTML = stringa;
    location.hash = "offerte"
    }
    Cavicchi Andrea
    Problemi con javascript, jquery, ajax clicca qui

  5. #5
    Utente di HTML.it L'avatar di allin81
    Registrato dal
    Mar 2011
    Messaggi
    1,875
    si è perfetto, grazie ancora una volta

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2024 vBulletin Solutions, Inc. All rights reserved.