Fehler bei JavaScript-Ausgabe in Editable Comments beseitigt

Um Besuchern meines Blogs das Kommentieren zu erleichtern, habe ich mich vor einiger Zeit dazu entschieden, eine Editierfunktion unter dem Kommentarfeld einzubauen.

Momentan verwende ich das Plugin Editable Comments, da dieses im Gegensatz zu Edit Comment XT auch mit verschachtelten Kommentaren klarkommt.

Auf diesem Blog funktioniert es auch einwandfrei. Aber ein Besucher meiner bunten Blogwelt teilte mir mit, dass die Buttons für ein Update bzw. Abbruch nicht richtig angezeigt wurden.

Daraufhin nahm ich in der Konfiguration des Plugins den Haken bei der Java-Script-Ausgabe heraus, so dass sich statt eines Popup-Fensters nun eine neue Seite bzw. neuer Tab zum Editieren öffnete. Um die Fehlersuche wollte ich mich später kümmern.

Stutzig machte mich nur, dass die Update-Funktion als Button, die Abbrechen-Funktion aber nur als Link angezeigt wurde.
Ein kurzer Test zeigte mir, dass ein Editieren wohl trotzdem einwandfrei möglich war.

Nun informierte mich netterweise Daniel darüber, dass bei ihm die Editierfunktion in der bunten Blogwelt Probleme bereitete. Also beschloss ich, mich endlich auf Fehlersuche zu begeben. Mich wunderte allerdings, dass es mit dem Plugin hier auf diesem Blog kein Problem gab.

Nachdem ich ein wenig recherchiert hatte, vermutete ich ein Javascript-Problem und stellte fest, dass im Seitenquelltext kein Eintrag

<script type="text/javascript" src="<?php bloginfo('stylesheet_directory'); ?>/js/jquery.min.1.2.6.js"></script>

existierte. Daher versuchte ich, durch Einfügen dieses Script-Codes an unterschiedlichen Stellen – mal in der header.php, mal in der footer.php des Themes den Fehler zu beseitigen. Vorher hatte ich noch die Javascript-Datei jquery.min.1.2.6.js in mein Theme-Verzeichnis eingefügt.
Dieser Eingriff bewirkte zwar, dass der Abbrechen-Button nun nicht mehr als Link, sondern als richtiger Button angezeigt wurde. Dafür war er aber funktionslos.

Gut, ein Javascript-Problem habe ich dann erst einmal ausgeschlossen und richtete daher den Focus auf die Datei style.css in meinem Theme.
Ein kleines Versehen bestärkte mich dann auch in meiner Vermutung, dass es sich um einen CSS-Eintrag handeln musste, der diesen Fehler verursachte. Im Eifer des Gefechts hatte ich irrtümlich die style.css dieses Blogs in das Verzeichnis der bunten Blogwelt hochgeladen. Ich bemerkte es erst gar nicht und freute mich schon, dass sich das Script-Fenster öffnete und die beiden Buttons einwandfrei angezeigt wurden … bis ich das verschobene Templatedesign bemerkte.

Was war schuld?

Problem also erkannt, aber welcher Eintrag war denn nun für die Fehlanzeige verantwortlich? Eine Kontrolle mit Firebug zeigte mir, dass es sich um irgendeinen Befehl mit dem Wort “input” oder/und “check” handeln musste.

Also habe ich erneut die style.css nach diesen Begriffen abgesucht und einen Code-Block gefunden, in dem ich den Fehler vermutete. Als ich diesen komplett entfernt hatte, klappte es mit der Javascript-Anzeige einwandfrei. Ich wollte aber nun wissen, welche Zeile genau für diesen Bug verantwortlich war und nach Wiedereinfügen des Blocks und zeilenweise Entfernen kam ich dem Verursacher auf die Spur. Es handelt sich um folgenden Eintrag:

input.checkbox{cursor:default;background:transparent;color:#bcbab7
;border:0;padding:0;margin:0;width:14px;height:14px}

Ich weiß nicht genau, wie dieser Eintrag dort entstanden ist. Es ist gut möglich, dass im Rahmen einer CSS-Optimierung durch Free CSS Toolbox eine Verschiebung der Befehle und somit den Bug verursacht hat.

Nun berichtete Daniel unter anderem noch von einem Caching-Problem. Bei ihm wurden nicht alle drei Kommentare eines Beitrages angezeigt, die bereits seit längerer Zeit online waren. Ich hoffe, dass dieses damit nun auch beseitigt ist, bitte Euch aber um Rückmeldung, falls Eure Kommentare nicht gleich erscheinen sollten.