Scratchbook

Das Leben ist immer anders als die Realität.

Ajax-enabled Spotlight!!!

Claude, 11. April 2006, 20:23 Uhr

Warning: Use of undefined constant ri_rand_compare - assumed 'ri_rand_compare' (this will throw an Error in a future version of PHP) in /home/httpd/vhosts/scratchbook.ch/httpdocs/wp-content/plugins/random-image-widget/random_image.php on line 129 Warning: Use of undefined constant ri_rand_compare - assumed 'ri_rand_compare' (this will throw an Error in a future version of PHP) in /home/httpd/vhosts/scratchbook.ch/httpdocs/wp-content/plugins/random-image-widget/random_image.php on line 130 Warning: preg_match(): Compilation failed: invalid range in character class at offset 4 in /home/httpd/vhosts/scratchbook.ch/httpdocs/wp-content/plugins/lightbox-plus/classes/shd.class.php on line 1384 Warning: preg_match(): Compilation failed: invalid range in character class at offset 4 in /home/httpd/vhosts/scratchbook.ch/httpdocs/wp-content/plugins/lightbox-plus/classes/shd.class.php on line 1384 Warning: preg_match(): Compilation failed: invalid range in character class at offset 4 in /home/httpd/vhosts/scratchbook.ch/httpdocs/wp-content/plugins/lightbox-plus/classes/shd.class.php on line 1384 Warning: preg_match(): Compilation failed: invalid range in character class at offset 4 in /home/httpd/vhosts/scratchbook.ch/httpdocs/wp-content/plugins/lightbox-plus/classes/shd.class.php on line 1384 Warning: preg_match(): Compilation failed: invalid range in character class at offset 4 in /home/httpd/vhosts/scratchbook.ch/httpdocs/wp-content/plugins/lightbox-plus/classes/shd.class.php on line 1384 Warning: preg_match(): Compilation failed: invalid range in character class at offset 4 in /home/httpd/vhosts/scratchbook.ch/httpdocs/wp-content/plugins/lightbox-plus/classes/shd.class.php on line 1384 Warning: preg_match(): Compilation failed: invalid range in character class at offset 4 in /home/httpd/vhosts/scratchbook.ch/httpdocs/wp-content/plugins/lightbox-plus/classes/shd.class.php on line 1384 Warning: preg_match(): Compilation failed: invalid range in character class at offset 4 in /home/httpd/vhosts/scratchbook.ch/httpdocs/wp-content/plugins/lightbox-plus/classes/shd.class.php on line 1384 Warning: preg_match(): Compilation failed: invalid range in character class at offset 4 in /home/httpd/vhosts/scratchbook.ch/httpdocs/wp-content/plugins/lightbox-plus/classes/shd.class.php on line 1384 Warning: preg_match(): Compilation failed: invalid range in character class at offset 4 in /home/httpd/vhosts/scratchbook.ch/httpdocs/wp-content/plugins/lightbox-plus/classes/shd.class.php on line 1384 Warning: preg_match(): Compilation failed: invalid range in character class at offset 4 in /home/httpd/vhosts/scratchbook.ch/httpdocs/wp-content/plugins/lightbox-plus/classes/shd.class.php on line 1384 Warning: preg_match(): Compilation failed: invalid range in character class at offset 4 in /home/httpd/vhosts/scratchbook.ch/httpdocs/wp-content/plugins/lightbox-plus/classes/shd.class.php on line 1384 Warning: preg_match(): Compilation failed: invalid range in character class at offset 4 in /home/httpd/vhosts/scratchbook.ch/httpdocs/wp-content/plugins/lightbox-plus/classes/shd.class.php on line 1384 Warning: preg_match(): Compilation failed: invalid range in character class at offset 4 in /home/httpd/vhosts/scratchbook.ch/httpdocs/wp-content/plugins/lightbox-plus/classes/shd.class.php on line 1384 Warning: preg_match(): Compilation failed: invalid range in character class at offset 4 in /home/httpd/vhosts/scratchbook.ch/httpdocs/wp-content/plugins/lightbox-plus/classes/shd.class.php on line 1384 Warning: preg_match(): Compilation failed: invalid range in character class at offset 4 in /home/httpd/vhosts/scratchbook.ch/httpdocs/wp-content/plugins/lightbox-plus/classes/shd.class.php on line 1384 Warning: preg_match(): Compilation failed: invalid range in character class at offset 4 in /home/httpd/vhosts/scratchbook.ch/httpdocs/wp-content/plugins/lightbox-plus/classes/shd.class.php on line 1384 Warning: preg_match(): Compilation failed: invalid range in character class at offset 4 in /home/httpd/vhosts/scratchbook.ch/httpdocs/wp-content/plugins/lightbox-plus/classes/shd.class.php on line 1384 Warning: preg_match(): Compilation failed: invalid range in character class at offset 4 in /home/httpd/vhosts/scratchbook.ch/httpdocs/wp-content/plugins/lightbox-plus/classes/shd.class.php on line 1384 Warning: preg_match(): Compilation failed: invalid range in character class at offset 4 in /home/httpd/vhosts/scratchbook.ch/httpdocs/wp-content/plugins/lightbox-plus/classes/shd.class.php on line 1384 Warning: preg_match(): Compilation failed: invalid range in character class at offset 4 in /home/httpd/vhosts/scratchbook.ch/httpdocs/wp-content/plugins/lightbox-plus/classes/shd.class.php on line 1384 Warning: preg_match(): Compilation failed: invalid range in character class at offset 4 in /home/httpd/vhosts/scratchbook.ch/httpdocs/wp-content/plugins/lightbox-plus/classes/shd.class.php on line 1384 Warning: preg_match(): Compilation failed: invalid range in character class at offset 4 in /home/httpd/vhosts/scratchbook.ch/httpdocs/wp-content/plugins/lightbox-plus/classes/shd.class.php on line 1384 Warning: preg_match(): Compilation failed: invalid range in character class at offset 4 in /home/httpd/vhosts/scratchbook.ch/httpdocs/wp-content/plugins/lightbox-plus/classes/shd.class.php on line 1384 Warning: preg_match(): Compilation failed: invalid range in character class at offset 4 in /home/httpd/vhosts/scratchbook.ch/httpdocs/wp-content/plugins/lightbox-plus/classes/shd.class.php on line 1384 Warning: preg_match_all(): Compilation failed: invalid range in character class at offset 4 in /home/httpd/vhosts/scratchbook.ch/httpdocs/wp-content/plugins/lightbox-plus/classes/shd.class.php on line 700 Warning: Invalid argument supplied for foreach() in /home/httpd/vhosts/scratchbook.ch/httpdocs/wp-content/plugins/lightbox-plus/classes/shd.class.php on line 707 Warning: preg_match_all(): Compilation failed: invalid range in character class at offset 4 in /home/httpd/vhosts/scratchbook.ch/httpdocs/wp-content/plugins/lightbox-plus/classes/shd.class.php on line 700 Warning: Invalid argument supplied for foreach() in /home/httpd/vhosts/scratchbook.ch/httpdocs/wp-content/plugins/lightbox-plus/classes/shd.class.php on line 707

2289.jpg

Leute… LEUTE… Es ist soweit: Modernste Technologie findet in meinem Weblog Einzug! Ich hab mich heute mal mit Ajax beschäftigt. Nein, gemeint ist nicht das Waschmittel, sondern eine Technologie namens Asynchronous Javascript and XML.

Zuerst: Probiert es einfach mal aus! Javascript im Browser aktivieren und dann mal etwas ins Suchfeld oben rechts eintippen! z.B. „Birs“ oder „Abend“. Aber schön langsam. Beobachtet, was dabei passiert… Jaaaaaa… 😀 😀 😀

MANN IST DAS GEIL!

Ich bin ganz aus dem Häuschen! Jetzt besteht wirklich fast kein Unterschied mehr zu Apple’s Spotlight. Und schnell ist das Teil! Ich meine, hier werden Daten durchsucht, die sich über fast eineinhalb Jahre angesammelt haben – Beiträge, Kommentare, Snapshots – und das alles in Sekundenbruchteilen, bereits während dem Tippen!
So sieht man bereits während der Eingabe, ob das gewünschte schon gefunden wurde und kann den Suchstring anpassen.

So, und jetzt etwas zur Technik:

2289-2.jpg

Normalerweise funktioniert die Kommunikation mit einem Webserver so:
Im Browser wird ein Link angeklickt, und der Server liefert die ganze Seite zurück. Und zwar bei jedem Klick.

Mit Ajax wird am Anfang die ganze Seite plus ein kleines Javascriptli geladen, welches als Ajax-Engine fungiert. Nun macht der Browser seine Anfragen nicht mehr direkt an den Server, sondern beim Anklicken der Links wird eine Javascript-Funktion aufgerufen. Und diese holt die Daten vom Server ab und stellt sie in den dafür vorgesehenen Bereich. Somit muss nicht jedesmal die komplette Seite neu geladen werden, sondern nur das was sich geändert hat.

Hier in meinem Fall „Spotlight“ überwacht das Javascript die Tastatureingaben im Suchfeld. Steht dort was drin, wird die Anfrage gestartet und sogleich zurückgegeben.

Nun – im Grunde genommen ist das hier nicht Ajax, sondern eher Ajah… Ich verwende nämlich kein XML, sondern direkt pures HTML. Geht rassiger, weil die Daten vom Browser direkt angezeigt werden können, ohne Umwege und ohne die CPU zu belasten.

Und ja, Spotlight funktioniert selbstverständlich weiterhin auch ohne Javascript. Wie schon angetönt, mein Javascript überwacht die Tastatureingaben. Kann es das nicht, ist ihm das auch egal. Mit einem Druck auf Enter gelangt man genau so zu den Ergebnissen.

Mehr zu Ajax: [Link]

Lülü

hesch di jo mol widr miese sälbr übrträffe….

rakudave

DAS ISCH JO DR HAMMER!!!
graz!

Foxie

Voll Geil!

MrWatch

cool!

Longneck

gäll!

ha jetzt d suechfunktion selber no chli optimiert. jetzt wird nach relevanz sortiert.

SELECT FROM WHERE LIKE ‚%bla%‘
wird zu
SELECT MATCH … AGAINST ‚%bla%‘

und das funktioniert sehr suuber. suech mol nach „appl“ und denn tipp s „e“ no hindedra. d reihefolg isch grad viel anderst!

Freidenker

aha, do het doch no öber gfalle an javascript gfunde… hehe.

Longneck

NEI!

🙂

i verwänd nur grad s absolute minimum an javascript – alles funktioniert au tipptopp ohni, drum hani mi mol überwunde chli drizcho.

i bi grundsätzlich nid gege javascript – aber die meiste webdesigner chönne eifach nid dermit umgoh! amigs stockt de browser richtig, bis e site vollständig glaade isch –> inakzeptabel! oder au: „java-script muss eingeschaltet sein, um diesen dienst nutzen zu können.“ pah, frechheit!

aber wenns dezent und richtig igsetzt wird isches wirklich voll geil – jetzt ebe grad AJAX.

javascript isch eigentlich wie ne gwürz: zviel isch gruusig.

Foxie

i totally agree! solangs begränzt wird ischs ql

Warning: count(): Parameter must be an array or an object that implements Countable in /home/httpd/vhosts/scratchbook.ch/httpdocs/wp-content/themes/scratchbook/navigation_bar_bottom.php on line 1