JavaScript Code Completion mit JSDoc

JavaScript ist ein perfektes Beispiel dafür, wie eine einst verrufene Skriptsprache immer mehr an Zuspruch gewinnen kann. Während man 1997 noch weitläufig dazu geraten hat, JavaScript im Webbrowser zu deaktivieren, so ist man 17 Jahre später anderer Meinung. Mittlerweile können mit JavaScript sogar Mac-OS-Programmabläufe automatisiert werden (siehe JavaScript for Automation) oder native Anwendungen für die Windows-Runtime geschrieben werden. Mit Chrome OS stellt Google sogar ein ganzes Betriebssystem auf den Markt, welches fest auf die Applikationsentwicklung mit JavaScript ausgerichtet ist.

Der aktuelle JavaScript-Trend macht sich auch in den IDEs bemerkbar. JavaScript ist nämlich im Gegensatz zu objektorientierten Programmiersprachen wie Java oder C# nicht typsicher. Die fehlende Typsicherheit in JavaScript macht die Programmiersprache zwar dynamischer aber zugleich auch anfälliger für Programmierfehler. Um der Fehleranfälligkeit vorzubeugen, gibt es bereits in einigen IDEs verschiedene Lösungswege. In Visual Studio wird beispielsweise JavaScript-Code während der Programmierung im Hintergrund ausgeführt, um durch IntelliSense eine sehr genaue Code-Vervollständigung anbieten zu können. Andere IDEs, wie beispielsweise IntelliJ IDEA oder NetBeans, machen sich Code-Kommentare zu Nutzen, um Objekte im Rahmen ihrer Verwendung auswerten zu können.

Die Code-Vervollständigung durch Kommentare zeige ich im folgenden Abschnitt.
JavaScript Code Completion mit JSDoc weiterlesen

Ajax.Autocompleter mit scriptaculous

Autovervollständigungen erleichtern dem Benutzer die Eingabe und sehen zudem sehr schick aus. Eine Möglichkeit um Autocomplete zu realisieren ist die Verwendung von scriptaculous.

Dabei müssen folgende Regeln beachtet werden:

  1. Zuerst „Prototype“ im head-Bereich einbinden
  2. Danach „script.aculo.us“ im head-Bereich einbinden
  3. Dem, für die Autocompletion gewünschten, Textfeld eine ID zuweisen
  4. Einen leeren DIV-Container mit ID für die Autocomplete-Ergebnisse erstellen
  5. Liste für die Werte zur Vervollständigung erstellen
  6. Den new Ajax.Autocompleter(...)-Aurfruf im body-Tag (!) durchführen

Bei Nichteinhaltung kann es zum Fehler this.element is null in control.js (Zeile 53) bei this.oldElementValue = this.element.value; kommen.

Ein weiterer beliebter Fehler ist Ajax.Autocompeter is not a constructor. Dieser Fehler basiert im Wesentlichen darauf, dass die Abhängigkeiten nicht gefunden wurden.

Die häufigsten Gründe dafür sind:

  • prototype.js und/oder scriptaculous.js wurden nicht eingebunden
  • prototype.js wurde nicht vor scriptaculous.js eingebunden
  • scriptaculous.js befindet sich ohne abhängige Includes (z.B. control.js) auf dem Server
  • Das DOM ist nicht valide

Ajax.Autocompleter mit scriptaculous weiterlesen