Aktualisiertes jQuery Visual Cheat Sheet v1.6

20. Mai 2011 at 21:18

Antonio Lupetti hat sein jQuery Visual Cheat Sheet auf die Version 1.6 aktualisiert. Das aktualisierte Cheat Sheet beinhaltet alle Funktionen und Ausdrücke, die in der jQuery 1.6 API verfügbar sind.

Download:  PDF-Dokument (auch für das iPad optimiert)
Download: Scribd Version

2 Tipps für die Arbeit mit Zend Framework und Ajax – Magento

24. März 2011 at 11:40

isXmlHttpRequest()

/**
* myAction from myController
*/
function myAction()
{
if  ($this->getRequest()->isXmlHttpRequest()) {
// do the handling of your ajax request
}
else {
// if it's not an ajax request then do regular handling here
}
}

JSON action helper

/**
* myAction from myController
*/
function myAction()
{
if ($this->getRequest()->isXmlHttpRequest()) {
// do the handling of your ajax request
$myArrayofData = array('a','b','c');
//encode your data into JSON and send the response
$this->_helper->json($myArrayofData);
//nothing else will get executed after the line above
}
else {
// if it's not an ajax request then do regular handling here
}
}
Weitere Tipps / nützliche Funktionen? Postet diese als Kommentar zum Artikel und ich nehme diese, wenn sinnvoll, mit in den Artikel auf.

SEO – AJAX Links für Google optimieren – AJAX crawlen

24. November 2010 at 00:01

Zu den aktuellen Internet-Technologien gehört selbstverständlich der Einsatz von AJAX. Die Inhalte werden schnell, effizient und live nach geladen ohne das ein kompletter Reload der Web-Seite notwendig ist. Damit steigt die Benutzerbarkeit (usability) der Webseite wesentlich.

Doch werden diese Webseiten sauber von Google oder anderen Suchmaschinen gecrawlt?

Um das zu erreichen sind folgende zwei Herangehensweisen sind möglich:

  1. Inhalte für Suchmaschinen werden auch mit einer statischen URL angeboten
  2. Inhalte für alle Besucher werden mit einer „AJAX-URL“ angeboten.

Die AJAX-URL basiert dabei auf das sogenannte „Hashbang“ (Kombination aus Raute-Symbol und Ausrufezeichen: !#). Durch das Hashbang wird Google signalisiert dass es sich um eine AJAX-URL handelt. Diese wird dann von der Suchmaschine wie folgt ausgelesen: Alles was nach dem Hashbang kommt wird in einem URL-Parameter umgewandelt: aus www.fly2mars-media.de/#!parameter/value wird www.fly2mars-media.de/?_escaped_fragment=parameter/value . Zeigen beide URLs den selben Inhalt, so ist für die Suchmaschine alles in Ordnung (kein duplicate content). Die Seiten mit dem Parameter „_escaped_fragment“ können ggf. mit dem Statuscode 301 auf sprechende URLs umgeleitet werden, z.B. www.fly2mars-media.de/parameter/value.

Mit Prototype Ajax Request ausführen wenn Seite geladen über document.ready – dom loaded function

8. Juli 2010 at 20:31

Ihr möchtet in Prototype ein Ajax-Request nach dem vollständigen Laden der Seite abschicken, habt allerdings kein Zugriff auf den Body-Tag?

Der traditionelle Weg ist den Java-Script-Aufruf vor dem schließenden Body-Tag zu setzen, gelegentlich hat man allerdings nicht immer Zugriff auf diesen, z.B. bei dem Aufruf einer Template-File eines CMS, eCommerce-System oder ähnlich.

Bei Prototype ist es möglich das über den Observe zu machen, z.B. so:

<code>Event.observe(window, 'load', function() {
.. do stuff ..
});</code>

Das Problem ist allerdings dass mit dieser Methode der Anwender warten muss bis das komplette Dokument inkl. aller Bilder und anderen Content geladen ist. Erst dann kann er auf der Seite interagieren. Die meisten Benutzer wollen allerdings nicht warten und gleich mit der Interaktion starten.

Hier ist die Prototype implementation des document.ready mit genauer Erläuterung der Funktionalität.

Hier ein kurzes Beispiel:

<script>
document.observe("dom:loaded", function() {
 myFunction();
 });
</script>

Jquery has a handy way of allowing you to do stuff as soon as the document object model for a page has loaded (ie. as soon as the browser has loaded all your markup). I’m currently working on a project that requires Prototype JS, and I had some difficulty finding the equivalent method.. hence this post.

I knew Prototype had evolved somewhat since I’d last used it extensively back in late 2006, and I also suspected they had implemented something similar.. but Google was not forthcoming.

The traditional way to do this (pre jQuery) was to put your javascript directly before the closing body tag. This way the browser is unable to execute it prior to loading the rest of the page. However this is kind of clunky if you are trying to abstract your javascript to a linked file, or would like to keep your behavioral code (javascript) separate to your markup (xhtml).

An alternative is to use the onload event – in Prototype you would use something like