Visualizzazione dei risultati da 1 a 6 su 6
  1. #1
    Utente di HTML.it
    Registrato dal
    Jan 2013
    Messaggi
    205

    Visualizzare risultati live in piccolo motore di ricerca

    Ciao.
    Ho un form con un input text per permettere all'utente di effettuare una ricerca.
    Nel form quando l'utente inserisce una lettera vorrei far comparire sotto le alternative che imposto io nel codice sorgente.
    Sono capace di farlo ma non con la selezione dei valori in base alla lettera che inserisce l'utente.

    Qui un esempio: http://www.flabell.com/files/38_e061...loy/index.html

    Non proprio così rifinito o in flash ma lo vorrei realizzare più semplice, anche grezzo.
    Avete delle idee su come poter fare?

  2. #2
    Moderatore di PHP L'avatar di Alhazred
    Registrato dal
    Oct 2003
    Messaggi
    12,097
    Dato che le alternative le imposti direttamente nel codice sorgente, ti serve solo Javascript.

    In PHP non devi fare assolutamente nulla, ti sposto.
    Earth2: 3QCNSPFQUH

  3. #3
    Utente di HTML.it
    Registrato dal
    Jan 2013
    Messaggi
    205
    Ok! Giusto!
    Qualche soluzione?

  4. #4
    Utente di HTML.it
    Registrato dal
    Oct 2009
    Messaggi
    636
    jquery ui autocomplete.

  5. #5
    Utente di HTML.it
    Registrato dal
    Jan 2013
    Messaggi
    205
    Grazie. Ottima suggerimento!

    Una domanda però:
    Se io volessi utilizzare l'autocomplete di jquery per far visualizzare le alternative come link, in modo che l'utente al click venga portato subito in un altra pagina senza passare per il form, come posso fare?

  6. #6
    Utente di HTML.it
    Registrato dal
    Oct 2009
    Messaggi
    636
    Il sorgente per l'autocomplete è un array di oggetti che possono avere come proprietà label e value, nel tuo caso puoi fare qualcosa del tipo:

    codice:
    $(function() {
      var availableTags = [
        {label: "label 1", value: "http:/tuosito.it?content=1"},
        {label: "label 2", value: "http:/tuosito.it?content=2"},
        {label: "label 3", value: "http:/tuosito.it?content=3"},
        {label: "label 4", value: "http:/tuosito.it?content=4"},
        {label: "label 5", value: "http:/tuosito.it?content=5"}
      ];
      $( "#tags" ).autocomplete({
          source: availableTags,
          select: function(event, ui){
            location.href = ui.item.value;
          }
      });
      });

Tag per questa discussione

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 © 2021 vBulletin Solutions, Inc. All rights reserved.