Implementering af autocomplete
For at gøre brugerens søgninger nemmere er der gjort brug af ”autocomplete” funktionalitet, der løbende foreslår relevante søgninger på felterne Postnummer, Kommune og Sogn. Til dette formål benyttes der en plugin kaldet ”jQuery.autocomplete”.
I klientens ”pageInit” funktion laves der et kald til funktionen ”loadAutocompleteData” der påbegynder indlæsningen af vores autocomplete data. Indlæsningen af disse data sker bevidst efter indlæsningen af selve klienten da det er sekundær data som ikke er nødvendig for den grundlæggende funktionalitet. Dette gør opstartstiden mindre ved at minimere antallet af HTTP forespørgsler under opstart.
Når vi modtager dataene for Postnummer, Kommune og Sogn skal disse sorteres og tilknyttes vores input felter. Vi kan se at alle tre data typer har en fælles opbygning og beslutter os for at tillade søgning på dataenes nummer eller navn. Grundet den fælles opbygning af vores data kan vi benytte os af en fælles funktion til at håndtere sortering og indsættelse af disse autocomplete data, kaldet ”assignAutocomplete”.
I denne funktion tilknytter vi dataene til vores input felter og angiver den visuelle formatering gennem formatItem, den maskinelle søgning gennem formatMatch og resultatets formatering gennem formatResult.
Når vi skriver søgestrengen ”København” vil vores formatItem funktion diktere at delresultaterne skal fremvises i formatet ”(1/20) 1050 København K”, der viser det samlede antal delresultater.
Da vi ikke har tænkt os at søge efter tallet 20 i den ovenstående streng dikterer vi i vores formatMatch funktion at et match kun skal opstå på søgningen af postnummer og navn.
I den sidstnævnte formaterer vi resultatet så de valgte postnumre, kommuner og sogne bliver indsat i vores input felt med både tal og numre i formatet ”1050 København K”.