Popolare dinamicamente una combo con ASP e Ajax
Pagina 1 di 3
Introduzione
Sorge spesso l'esigenza, in fase di progettazione di un modulo HTML da offrire ai propri utenti, di usare una combo (o che dir si voglia una selectbox) per consentire di scegliere dei dati, magari estratti dal database.
Finchè questi dati sono al massimo 20, o anche 30, va bene, ma quando iniziamo a parlare di decine e decine, o addirittura centinaia o migliaia di dati, si rischia di gravare troppo sul database.
Stiamo parlando di una combo, quindi non possiamo pensare alla classica paginazione come soluzione al problema, quindi dobbiamo inventarcene un'altra.
Ipotizziamo che i dati prelevati dalla combo siano i nominativi di un database di utenti (ecco un caso che prevede anche migliaia di record) e la soluzione ottimale è quella di effettuare delle query in funzioni delle iniziali dei nomi.
Di seguito uno screenshot che chiarirà meglio il risultato finale:
Certo, anche in questo caso possiamo avere centinaia di utenti il cui nome inizia con la stessa iniziale... ma proviamo a moltiplicare "centinaia" per "A-Z" e vedremo che la soluzione è comunque da tenere in seria considerazione.
Useremo AJAX in uno script ASP, basandoci su un database Microsoft Access.
Struttura dell'applicazione
Creiamo la cartella ajax nel nostro server Web personale, assegnamole i permessi in scrittura ed accingiamoci a creare i quattro file che compongono la nostra applicazione:
- db.mdb - il database che contiene la tabella a cui ci interfacceremo per ottemperare alle funzionalità in oggetto.
- combo.html - il file di interfaccia dell'applicazione che conterrà il modulo, quindi la combo dinamica che genereremo dinamicamente.
- combo.js - il motore Javascript dell'applicazione che, via XMLHTTP, chiama lo script ASP.
- combo.asp - il file ASP che accede al database e, in funzione dell'iniziale che passeremo via AJAX in querystring, genererà dinamicamente la combo, oppure avviserà che non ci sono risultati disponibili per una determinata iniziale.
Il database
All'interno della nostra cartella di lavoro, creiamo il database db.mdb, composto dalla tabella utenti, a sua volta composta dai seguenti campi:
- id (Contatore)
- nominativo (Testo, 50 caratteri)
Anzi, per la verità il nominativo è l'unico campo che ci interessa.
Il file HTML
Creiamo il file combo.html ed corrediamoli dei tre spezzoni di codice indispensabili per il funzionamento dello script, a prescindere quindi dal resto del layout grafico e stilistico.
Richiamiamo il file Javascript:
<script type="text/javascript" src="combo.js"></script>Creiamo il menu:
<a href="javascript:Richiesta('A')">A</a> |
<a href="javascript:Richiesta('B')">B</a> |
<a href="javascript:Richiesta('C')">C</a> |
...
preoccupandoci di completarlo fino alla Z, passando come parametro alla funzione la lettera correspondente all'iniziale corrente.
In fine, creiamo il form e, nel punto in cui vogliamo che la combo compaia, inseriremo il livello di testo assegnandogli un ID:
<form name="modulo">
<div id="risultati"></div>
</form>
che useremo attraverso Javascript.
