TinyTable - Tabelle mit Javascript aufpeppen funzt nicht

Webdesign & Technik Javascript
1

Hallo Leute,

ich versuche gerade, eine Tabelle mit einem Javascript ein wenig aufzupeppen, das Script heißt TinyTable und kommt von leigeber.com/2009/11/advance … le-sorter/
Eingebunden habe ich es auf aurachtaler.de/beta_archiv.php
allerdings gibt es dabei einige probleme, laut der javascript-konsole von firefox ist “sorter not defined” - inwiefern? ich kapiere das nicht ganz, ich hab noch die ein oder anderen meinungsverschiedenheiten mit javascript, und ich habe ehrlichgesagt keine ahnung, was daran falsch ist. ich hab mir zwar mal den ganzen code überflogen, aber so ganz… ich meine an sich funktioniert das ganze - siehe beispiel auf der seite, also wird es wohl an meiner einbindung liegen… kann mir iwer helfen?

danke
emil

2

Also ich kriege in der Konsole von Firebug die Meldung

angezeigt, für folgende Zeile:

in script.js (line 31); c ist dabei ein TH-Element mit der Klasse “head”.

Die Funktion ist definiert als

  • sie sucht also mit dem Aufruf oben in th.head nach einer h3-Überschrift - nur die gibt es in deinem HTML nicht. Also kann auch nicht auf das erste Element dieser NodeList zugegriffen werden, weil keins existiert.

Bei Scripten, die auf einer bestimmten DOM-Struktur aufsetzen, musst du diese Struktur auch einhalten, wenn sie funktionieren sollen.

3

okay, danke, allerdings glaube ich nicht dass das der (einzige) fehler war, denn nach wie vor meckert firefox

[quote]Fehler: sorter is undefined
Quelldatei: aurachtaler.de/beta_archiv.php
Zeile: 1"[/quote]

4

Hallo emil

Wozu das Scipt?
Deine Tabelle ist ja nicht soo groß und mit ein wenig css sieht es genauso aus.
Die Vorteile dieses Scripts sind mir noch nicht ersichtlich :wink:

5

Hi, die Tabelle wird wachsen :slight_smile:
mir ging es vor allem um 1. die sortierfunktion beim klick auf den table-header und 2. die filter-funktion. hauptsächlich um die filterfunktion :slight_smile:
ein super nebeneffekt ist, dass das script die tabelle auf “seiten” aufteilt etc…

6

var sorter = new TINY.table.sorter('sorter','table',{ headclass:'head', ascclass:'asc', descclass:'desc', evenclass:'evenrow', oddclass:'oddrow', evenselclass:'evenselected', oddselclass:'oddselected', paginate:true, size:10, colddid:'columns', currentid:'currentpage', totalid:'totalpages', startingrecid:'startrecord', endingrecid:'endrecord', totalrecid:'totalrecords', hoverid:'selectedrow', pageddid:'pagedropdown', navid:'tablenav', sortcolumn:0, sortdir:1, init:true });

klappt super

7

vielen dank! klappt tatsächlich einwandfrei.

EDIT: Muss ein select-tag kind-elemente haben? ich erhalte nämlich fehler beim w3d-validator ( validator.w3.org/unicorn/check?u … nformance# ), konnte bei selfhtml aber keinen hinweis darauf finden, dass dies der fall sein muss.

8

[quote=“emil”]vielen dank! klappt tatsächlich einwandfrei.

EDIT: Muss ein select-tag kind-elemente haben? ich erhalte nämlich fehler beim w3d-validator ( validator.w3.org/unicorn/check?u … nformance# ), konnte bei selfhtml aber keinen hinweis darauf finden, dass dies der fall sein muss.[/quote]

warum sollte man ein leeres select element haben? das ist recht sinnfrei oder? ^^
gut möglich, dass mindestens eine option verfügbar sein muss

9

w3.org/TR/1999/REC-html401-1 … tml#h-17.6

Man beachte das +

Und noch mal Schwarz auf Weiß, gleiche Stelle:

10

okay… schlecht…
danke dir trotzdem