✔ Einzelne Spalten in Tabelle nach Zeit hervorheben

[TroubleXA]

Also der Titel klingt schon rehct komisch, geb ich zu, aber ich habe eine ganz normale table, derren einzelne Spalten/Zeilen ich hervorheben möchte(womit is nochmal ne andere frage) und zwar eine bestimmte Zelle(also keine ganze reihe), nach einer bestimmten Uhrzeit, ohne die Seite (von hand) neu laden zu müssen..

Ich weiß, das ist mit HTML selbst wohlt nicht möglich, ich dachte da mehr so an die richtung Javascript, aber war mir nicht ganz sicher, vor allem soll die Seite später Offline verfügbar sein, also bei aufrufen selbstständig arbeiten können.

Würde mal einfach gerne wissen, was da wie und womit geht


(P.S. ist eine Art "Tagesplan" wo eben die Zeiten/Aufgaben drauf sind)

 

[con-f-use]

Mit Javascript kannst du einzelnen Tabellenzeilen über die document.Element-Funktionen ansprechen. Dann kannst du ihre style-Eigenschaften per setAttribute() oder per style.eigentschaft='wert' verändern.

Lies dir einfach das nötige an und versuch's. Wenn du auf Probleme stößt, kannst du ja nochmal dein konkretes Problem hier im Thread posten.

 

[TroubleXA]

Könntest du mal ein Beispiel machen, ich kann mir das nämlich im moment grade nicht so ganz vorstellen wie das zu verstehen ist, ich schätzemal irgendwas mit ner if-anweisung und ner reload-page-anweisung. und das dann dementsprechend vor jedem <td> tag oder so?! also ich währe um ein beispiel dankbar.

Am besten du setzt das grade mal hier ein:

<table>
<tr>
<th>Zeit</th><th>Montag</th><th>Dienstag</th><th>Mittwoch</th><th>Donnerstag</th><th>Freitag</th><th>Samstag</th><th>Sonntag</th>
</tr>
<tr>
<td>Morgen</td><td>Beispiel....
</tr>
<tr>
<td>Mittag</td>...
</tr>
<tr.....
......
.....

 

[con-f-use]

Eigentlich nein, aus folgendem Grund:

..."ich habe eine ganz normale table, derren einzelne Spalten/Zeilen ich hervorheben möchte(womit is nochmal ne andere frage) und zwar eine bestimmte Zelle (also keine ganze reihe), nach einer bestimmten Uhrzeit, ohne die Seite (von hand) neu laden zu müssen..[sic]"

Wer soll denn diesen Satz bitte verstehen? Du möchstest "Spalten/Zeilen hervorheben [...] und zwar eine bestimmte Zelle". Das ist schonmal ein Wiederspruch. Was jetzt Zellen oder Zeilen?! Dann: Was meinst du mit "nach einer bestimmten Uhrzeit"? Sollen die Zellen nach dem dritten Schalg von der Krichturmsuhr gegenüber hervorgehoben werden oder meinst du die Uhrzeit ist ein Kriterium und steht in deiner Tabelle und die Zellen sollen jetzt nach diesem Kriterium sortiert bzw. hervorgehoben sein? Und was sollte es unter Umständen nötig machen "die Seite (von hand [sic]) neu laden zu müssen"?

Ich habe ja keine Ahnung, was du genau vorhast, deswegen war ich in meinem Post so allgemein wie du in deinem Eingangspost. Ich habe ehrlich gesagt nicht verstanden was du genau willst (und ich möchte mal behaupten das war auch unmöglich) - nur verstanden, dass du irgenwelche Tabellenelemente hervorheben willst. Welche genau, nach welchen Kriterien und wie die Hervorhebung genau aussehen soll, konnte ich leider aus deinem äußerst unverständlichen und wirren Beitrag nicht rauslesen. Deswegen habe ich etwas Allgemeines zum hervorheben in Tabellen geschreiben. Wenn du was genaueres haben willst, dann musst du selber auch genauer sein.

Und ich dachte ich wär konfus. :suspekt:

 

[TroubleXA]

Hehe, du wirst abgelöst
denn hier kommt con-f-junior

Eine Beispielgrafik:http://img113.imageshack.us/img113/6356/beispiel3xe.png

Und jetzt soll, nachdem die Kirche gegenüber am Montag 8 Uhr geschlagen hat, das die zelle, wo "Beispiel1" drinne steht, rot/blau/gelb(wie auch immer), hervorgehoben wird, dazu dachte ich mir eignet sich am besten ein if-anweisung, die den background wechselt(also Farbe).
Und genau um 10, soll das wieder verschwinden und bei "Beispiel2" auftauchen

Ich hoffe das war etwas genauer beschrieben

 

[con-f-use]

Vielleicht nicht genauer, aber durchaus so, dass es auch ein anderer Konfuser verstehen konnte...

Du willst also eine Art Studenplan machen, bei dem immer die Stunde im Plan, die gerade läuft angezeigt wird, richtig?

Das ist jetzt natürlich ein wenig komplizierter und ich habe keine Ahnung wie viel du von Javascript verstehst (ich schätze mal eher weniger), darum weiß ich nicht, ob dir meine Erklärung jetzt was bringt. Ich versuch's einfach mal:

In so einer Tabelle bekommst du die Elemente am besten über die childNodes-Eigenschaft zu fassen. Bei einer Normalen Tabelle sind die childNodes alle <tr>-Elemente - also die Zeilen der Tabelle. Deren childNodes wiederum sind alles <td>-Elemente - also die Spalten wenn man so will.
Das heißt, wenn man z.B. die dritte Spalte in der vierten Zeile verändern will, müsste man aus Javascript-Sicht childNodes[3].childNodes[2] beeinflussen (die Zählung fängt bei Null und nicht bei Eins an, daher immer eins weniger). Soweit klar denke ich.
Bei deiner Tabelle stehen in den Zellen die Stundenplanereignisse (Schulstundne oder was auch immer), in den Spalten nach Tagen sortiert, wobei in der ersten Spalte jeder Zeile jeweils die Anfangs- und die Endzeit jedes Ereignisses steht.
Was du jetzt machen musst in die aktuelle Zeit über die Date-Methoden bestimmen, in einer Schleife jeweils die ersten Spalten jeder Zeile durchgehen, per String-Funktionen die Start- und Endzeit extrahieren und schauen, ob die aktuelle Zeit dazwischen liegt. Damit bekommst du dann den Index "Zeile" für ChildNodes[Zeile]. Sprich die Nummer der Zeile, wo das aktuelle Ereigniss drinsteht. Jetzt hast du schonmal die richtige Zeile.
Die Richtige Spalte bekommst du indem du den Wochentag bestimmst (ebenfalls über die Date-Methoden) und je nach Wochentag einen anderen Index "Spalte" für childNodes[Spalte] angibst, so hast du dann letztlich die Nummer der Spalte.
Highlighten tust du das Ereigniss dann schließlich über z.B. childNodes[Zeile].childNides[Spalte].style.backgroundColor = "#FF0000" für Rot. Jetzt bist du am Ziel.

Ich hoffe mal du hast das Prinzip verstanden. Und bevor du fragst: Nein, ich bin nicht bereit dir das Script zu schreiben, bzw. ein Beispiel zu machen. Das hat zum einen den Grund das du selber Arbeiten sollst und wenn du keine Ahnung von Javascript hast (oder nicht genug), musst du's halt lernen, zum anderen, dass ich schlicht und einfach zu faul bin. :suspekt:

Wenn du auf Probleme stöß, dann helfe ich dir aber weiterhin gerne auf die Sprünge. Poste dann einfach nochmal dein konkretes Prolem hier im Thread.

 

[TroubleXA]

Highlighten tust du das Ereigniss dann schließlich über z.B. childNodes[Zeile].childNides[Spalte].style.backgroundColor = "#FF0000" für Rot. Jetzt bist du am Ziel.

Du meinst hier doch sicherlich child.nodes, oder?

Und bevor du fragst: Nein, ich bin nicht bereit dir das Script zu schreiben, bzw. ein Beispiel zu machen. Das hat zum einen den Grund das du selber Arbeiten sollst und wenn du keine Ahnung von Javascript hast (oder nicht genug), musst du's halt lernen, zum anderen, dass ich schlicht und einfach zu faul bin. :suspekt:

Du denkst immer so schlecht von einem
Ich will garnicht, das du das machst (so schlimm bin ich jetzt auch wieder nicht)...

Nein, eigentlich ging es mir nur daran, wie ich eben eine Bestimmte Zelle am besten "zu packen kriege", das mit den ChildNodes ist mir neu, aber ich werds nacher gleich mal probieren, wenn ich dabei auf hilfe stoß weiß ich ja, das ich mich vertrauensvoll an dich wenden kann :-(


P.S.: Denke mal der Hauptinhalt, ist erledigt

 

[con-f-use]

Ach was, "schlecht von einem" denken, Mumpitz! Nach über 1000 Beiträgen hier im Forum bin ich nur Realist.^^

Du meinst hier doch sicherlich child.nodes, oder?

Nö, child.nodes gibt es nicht. Die Eigentschaft heißt schon childNodes (auch mit der Groß-/Kleinschreibung).

 

[Sven Mintel]

So gut ist der Zugriff auf Tabellenelemente per childNodes leider doch nicht.

probiert bspw. mal folgendes:

<table onclick="alert(this.childNodes[0].tagName)">
<tr><td>Zelle</td></tr>
</table>

.... das Ergebnis wird anders als erwartet sein.

Bei Tabellen würde ich auf jedenfall nach JS-Methode und nicht nach DOM-Methode zugreifen.... über die rows/cells -Arrays.