AJAX: Direct Zoeken

De zoekopdracht “AJAX” levert op dit moment bij Google nog voornamelijk verwijzingen op naar die club in Amsterdam, maar ik heb het hier over dat andere AJAX, namelijk Asynchronous JavaScript and XML. Het is een van dé nieuwe buzzwords op dit moment (zie bijvoorbeeld technorati of Google Blogsearch) samen met uiteraard Web 2.0 waar het een belangrijk bestanddeel vanuit maakt. En ik moet zeggen dat ik er eigenlijk inmiddels ook tamelijk verknocht aan geraakt ben.
Wat is het?
De meeste websites zijn heel simpel in hun werking: je voert een adres in in een browser en krijgt een pagina te zien. Op die pagina staan links die je naar een andere pagina brengen of je vult formulieren in die verstuurd worden naar de server.
Je ziet daarbij de hele tijd dat een verzoek naar een server wordt verstuurd, de browser wat ophaalt, ontvangt, de pagina opnieuw opbouwt en het resultaat laat zien. Simpel.

Bij AJAX is dat niet meer helemaal zo. Door middel van JavaScript-code kunnen heel geavanceerde resultaten bereikt worden en gaan internetpagina’s zich bijna gedragen als ‘echte’ programma’s.

Neem bijvoorbeeld het ‘direct zoeken’ veld rechtsboven op de voorpagina van deze site:

Direct zoeken - Klik voor grotere versie

Als je een zoekterm begint te typen, zie je dat er meteen maximaal 10 resultaten getoond worden. Zonder dat je op de ENTER-toets gedrukt hebt. Elke letter die je toevoegd of verwijderd zorgt er voor dat het resultaat bijgewerkt wordt.

Wat heb je er voor nodig?
Meestal niet veel. In dit geval een iets aangepaste versie van een stukje JavaScript dat ik van deze wiki gehaald heb en een aangepaste zoekpagina in Nucleus.

Die zoekpagina geeft een XML-structuur terug naar aanleiding van een zoekopdracht.
Het stukje JavaScript zorgt er voor dat bij elke wijziging de zoekopdracht opnieuw uitgevoerd wordt.
Dus als jij bijvoorbeeld invoert: test.
Dan zijn er in totaal 4 zoekdrachten uitgevoerd:
* voor t
* voor te
* voor tes
* voor test

Overigens, als je de resultaten een beetje raar vind, dan kan ik daar nog niet veel aan doen. Ik gebruik de ingebouwde zoekfunctionaliteit van Nucleus en die levert soms aparte resultaten op.

Omdat ik niet té veel resultaten wil laten zien, heb ik onder aan de resultaten ook een link opgenomen naar de reguliere zoekpagina. Daar kun je dan, zonder AJAX, verder door de resultaten bladeren. Die linkt verschijnt alleen als er resultaten zijn.

Als je geen JavaScript toestaat, dan zie je gewoon een knop om op te klikken en kun je uiteraard geen gebruik maken van AJAX.

Andere toepassingen
Er zijn nog een heleboel andere sites die AJAX al gebruiken, die komen de komende tijd deels nog apart langs.

Voorlopige conclusie
Het resultaat is eenvoudig te bereiken, maar toch tamelijk indrukwekkend. Dit lijkt me echter wel iets wat veel extra belasting op een webserver legt. Immers, bij een woord van 8 letters wordt er niet één zoekopdracht verstuurd (zoals voorheend), maar worden er binnen korte tijd wel acht zoekopdrachten verstuurd.

0 0 stemmen
Bericht waardering
2 Reacties
Inline Feedback
Bekijk alle reacties
duimdog
18 jaren geleden

Dank voor de uitleg. Ik had inderdaad al wat AJAX-gebuzz gehoord. Is Google maps ook geen toepassing van AJAX?

Pierre
18 jaren geleden

Hoi Michel, Ja dat klopt. Ik kwam hier trouwens een interessant artikel tegen waar ze met behulp van AJAX zelf een ‘Google-maps’ applicatie bouwen.