Tabellen Kopfzeile stehen lassen beim scrollen

[miniA4kuser]

Wofür wird die denn gebraucht?

Damit wird die mitbewegende Kopfzeile aktualisiert. Sofern man den Inhalt der Tabelle geändert hat, einfach diese Methode aufrufen, so wie in meinem Beipiel nachdem Zeilen hinzugefügt bzw. entfernt worden sind.

Dann warte ich lieber doch noch auf den neuen Code oder ist das eine ganz separate function außerhalb der function fixedTableHeader?

Sofern du keine Änderungen an der Tabelle vornimmst, kannst du den jetzigen Code zum Testen verwenden. Die Implementierung erfolgt zusätzlich und unabhängig davon.

 

[mikdoe]

Damit wird die mitbewegende Kopfzeile aktualisiert. Sofern man den Inhalt der Tabelle geändert hat, einfach diese Methode aufrufen, so wie in meinem Beipiel nachdem Zeilen hinzugefügt bzw. entfernt worden sind.

OK. Was ich noch bräuchte: In der Kopfzeile sind ja Buttons zum Sortieren. Wenn ein Button angeklickt wird mache ich dort immer ein Warte-Icon rein. Ich bräuchte also eine Möglichkeit, auch die geclonten Zellen per ID ansprechen zu können.

Sofern du keine Änderungen an der Tabelle vornimmst, kannst du den jetzigen Code zum Testen verwenden. Die Implementierung erfolgt zusätzlich und unabhängig davon.

OK, alles klaro.
Danke dir!

 

[miniA4kuser]

Wenn ein Button angeklickt wird mache ich dort immer ein Warte-Icon rein. Ich bräuchte also eine Möglichkeit, auch die geclonten Zellen per ID ansprechen zu können.

Wo? In der sich mitbewegenden Kopfzeile? Dann müsste man auf doppelte ID's filtern und entsprechend patchen.

 

[mikdoe]

Wo? In der sich mitbewegenden Kopfzeile?

Ja. Natürlich auch in der ursprünglichen. Aber es ist unwahrscheinlich, dass jemand in der ursprünglichen einen Button anklickt, dann schnell runterscrollt und dann bemerkt, dass das Warte-Icon in der sich bewegenden fehlt.
Aber wenn man die ID's der ursprünglichen mit der jeweiligen in der geclonten fest koppeln könnte wäre toll. Sodass es egal ist, in welcher ich den Button klicke, es wird dann in beiden an die Stelle ein Warte-Icon gesetzt.

 

[Kasalop]

also in Opera sieht das nicht wirklich schön aus. scrollt viel zu früh mit und hört zu spät auf. Außerdem sehr "rukelig".

Ich hab nicht den ganzen thread gelesen, also falls das gewollt war einfach ignorieren, aber wollte es mal anmerken, da hier ja die meisten nicht Opera verwenden

Lg Kasalop

 

[miniA4kuser]

@Kasalop: Das konnte ich jetzt so nicht feststellen. Welche Opera Version benutzt du? Welche Version des Scriptes hast du denn ausprobiert?

 

[mikdoe]

also in Opera sieht das nicht wirklich schön aus. scrollt viel zu früh mit und hört zu spät auf. Außerdem sehr "rukelig".

Kann ich nicht unterschreiben. Bei mir auf Windows 7 ist die Anzeige im Opera 12.12 exakt gleich mit IE9 und sie ist in Ordnung.
Das späte scrollen ist natürlich Geschmacksache aber ich brauche es nicht schneller. Ruckeln ist bei mir nicht.

@miniA4kuser: Würdest du mir noch die Sache mit den ID's einbauen? Dann hätten wir schonmal 90 %.

 

[miniA4kuser]

Werde mal schauen, soll ja ordentlich werden...

 

[mikdoe]

Werde mal schauen, soll ja ordentlich werden...

Ultracool! Danke dir!

 

[Kasalop]

@Kasalop: Das konnte ich jetzt so nicht feststellen. Welche Opera Version benutzt du? Welche Version des Scriptes hast du denn ausprobiert?

Opera/9.80 (Windows NT 6.1; WOW64) Presto/2.12.388 Version/12.12 => also auch 12.12 auf win7.

Aber nun gut. ich schau mal oder wenn ich freude habe mache ich morgen mal nen kleines video, dann könnt ihr beurteilen ob es gewollt ist oder ob da noch iwo nen fehler ist ^^

Lg Kasalop

 

[miniA4kuser]

Habe die Testseite mal aktualisiert.

 

[mikdoe]

Habe die Testseite mal aktualisiert.

Wirklich hammermäßig gut!!!
Eine Frage: Wäre es sehr viel Aufwand oder vielleicht nur ein Parameter, dass die geclonte Kopfzeile erst anfängt sichtbar zu werden, wenn die originale komplett aus dem Anzeigebereich verschwunden ist? Das würde die derzeitige leichte Überlagerung im Grenzbereich vermeiden.

Und eine Bitte (ich versuche es mal zu beschreiben): Ich habe unter der Tabelle einen "Hilfe" Bereich. Das ist ein div welches auf Knopfdruck die display='' bekommt. Beim Aufklappen ist alles kein Problem, die Kopfzeile scrollt nach oben weg und fährt wieder hinein ins Bild.
Allerdings beim Zuklappen (jetzt bekommt das div display='none') kommt die Tabelle ja wieder auf einen Schlag ein großes Stück nach unten ohne dass der Benutzer dies durch Scrollen verursacht hat. Das bekommt die geclonte Kopfzeile nicht mit und bleibt mitten im Bild stehen.
Können wir es so machen, dass ich in meinem div eine Art "Re-Positionieren" anstoßen kann? Oder könnte man der Kopfzeile das Verhalten auch "automatisch" beibringen?

Nochmal allerherzlichesten Dank, es ist bis jetzt schon wirklich hammergut geworden!!!
Ich freue mich wirklich tierisch darüber.

 

[miniA4kuser]

Eine Frage: Wäre es sehr viel Aufwand oder vielleicht nur ein Parameter, dass die geclonte Kopfzeile erst anfängt sichtbar zu werden, wenn die originale komplett aus dem Anzeigebereich verschwunden ist? Das würde die derzeitige leichte Überlagerung im Grenzbereich vermeiden.

Mal schauen...

Und eine Bitte (ich versuche es mal zu beschreiben): Ich habe unter der Tabelle einen "Hilfe" Bereich. Das ist ein div welches auf Knopfdruck die display='' bekommt. Beim Aufklappen ist alles kein Problem, die Kopfzeile scrollt nach oben weg und fährt wieder hinein ins Bild.
Allerdings beim Zuklappen (jetzt bekommt das div display='none') kommt die Tabelle ja wieder auf einen Schlag ein großes Stück nach unten ohne dass der Benutzer dies durch Scrollen verursacht hat. Das bekommt die geclonte Kopfzeile nicht mit und bleibt mitten im Bild stehen.
Können wir es so machen, dass ich in meinem div eine Art "Re-Positionieren" anstoßen kann? Oder könnte man der Kopfzeile das Verhalten auch "automatisch" beibringen?

Das kann ich jetzt so nicht nachvollziehen. Dann scheint der Browser wohl das scroll-Event nicht zu feuern. Dies kannst du aber manuell mittels

jQuery(window).scroll();

feuern, welches den Mechanismus im Script auslöst.

 

[mikdoe]

Das kann ich jetzt so nicht nachvollziehen.

Warum nicht? Liegt es an meiner Beschreibung oder besteht das Problem in deinen Browsern nicht? Ich kann das leider auch nur im IE 9 reproduzieren. Also wird es am Browser liegen.

Dann scheint der Browser wohl das scroll-Event nicht zu feuern. Dies kannst du aber manuell mittels

jQuery(window).scroll();

feuern, welches den Mechanismus im Script auslöst.

Ja!! Geil! Das wäre tatsächlich eine Lösung.
Aber mir ist gerade eingefallen, das wäre strukturell etwas doof. Denn ich will die ganze Tabellendarstellung kapseln. Das heißt, in einem etwas größeren Projekt wird durch die zentrale Änderung des Codes quasi in allen Teilen etwas geändert. Wenn nun also die Lösung nicht direkt in der Tabelle liegen würde müsste ich alle Module darauf hin überprüfen und solche Fälle anfassen.
Daher meine Frage: Läßt sich dieses fehlende scroll-Event in einem solchen Fall irgendwie innerhalb der function fixedTableHeader() kompensieren? Das wäre eine große Erleichterung.
Aber wenn es nicht geht beiße ich in den sauren Apfel.
Ich stelle mir das schwierig vor, soetwas aufzufangen. Könnte man ja höchstens durch eine intervallmäßige Überprüfung der Scrollposition machen. Das würde wieder Ressourcen fressen und das wäre es nicht wert. Oder hast du noch eine andere Idee?

 

[miniA4kuser]

Warum nicht? Liegt es an meiner Beschreibung oder besteht das Problem in deinen Browsern nicht? Ich kann das leider auch nur im IE 9 reproduzieren. Also wird es am Browser liegen.

Ist wohl eine Verständnisfrage... Kannst ja evtl. mal versuchen meine Testseite soweit zu ändern, das dein beschriebenes Problem auftritt? Dann kann ich das in meinen Browsern testen, habe ja keinen IE9.

Erst dann würde ich es für sinnvoll halten über weitere Maßnahmen nachzudenken.

 

[mikdoe]

Ist wohl eine Verständnisfrage... Kannst ja evtl. mal versuchen meine Testseite soweit zu ändern, das dein beschriebenes Problem auftritt?

Du hast das in Table with fixed header V.4.3.0 schon drin mit dem big div container below the table.
Der einzige Unterschied zu meiner ist, dass ich das div nicht animiert auf und zu mache sondern auf einen schlag mit style.display = '' oder = 'none'.
Du hast das Problem bereits exakt erkannt.

 

[miniA4kuser]

Du hast das in Table with fixed header V.4.3.0 schon drin mit dem big div container below the table.

Tritt denn dein erwähntes Problem mit der V.4.3.0 auf?
Wenn ja kannst du es nochmal genauer bescheiben?
Und das passiert dann nur im IE9?
Oder auch in andere Browsern?

 

[mikdoe]

Tritt denn dein erwähntes Problem mit der V.4.3.0 auf?

Ja, nach wie vor.

Wenn ja kannst du es nochmal genauer bescheiben?

Wenn sich unterhalb der Tabelle mit der fixierten Kopfzeile ein div mit sagen wir mal 10 Zeilen Höhe befindet und du scrollst gaaaaanz runter ans Ende der Seite und nun blendest du dieses div auf Knopfdruck mittels JS style.display='none' quasi aus, dann bewegt sich das Bild ja schlagartig wieder nach oben.
Und genau dann bekommt die Kopfzeile nicht mit, dass das Bild wieder gescrollt wurde. Sie bleibt da stehen, wo sie zuletzt stand und das ist dann natürlich mitten im Bild.
Erst wenn du dann wieder mit dem Balken oder dem Mausrad scrollst bemerkt sie, dass sie falsch steht und geht an ihren Platz zurück.
Du hattest das bereits richtig analysiert. Der IE scheint bei einer solchen Aktion kein scroll event zu feuern.
Ich würde mir die Zeit nehmen und das in deine Testseite einbauen aber es wird dir nichts nützen, weil du keinen IE hast.
Soll ich Korbinian mal gaaaaaaanz nett fragen, ob er mit drauf schaut? Er hat einen IE9 und bestimmt kann er uns/dir einen Tipp geben.
@Korbinian, ob du evtl. ein paar Minuten Zeit hättest, mit zu testen? Vielleicht weißt du zufällig, warum der IE hier so reagiert, woran das genau liegt?

Und das passiert dann nur im IE9?

Habe IE9, FF, Opera, Chrome und Safari getestet.
Tritt im Moment nur im IE9 auf. IE8 habe ich im Moment nicht zur Hand, denke aber, der wird genau so reagieren.

Oder auch in andere Browsern?

Nein. Scheinen alle das scroll event wie benötigt zu feuern.

 

[mikdoe]

Noch zwei Ergänzungen:

1. Im IE8 ist das Verhalten gleich mit dem IE9

2. Im IE funktioniert das ganze Script im Moment nur, wenn ich vorher einmal die Seite mit geöffneter F12 Konsole gestartet hatte. Wenn also einmal in der Konsole "SCROLLING" stand. Vorher nicht. Danach kann ich die Konsole wieder schließen, dann funktioniert es weiter. Aber einmal muss sie auf sein, sonst läuft es nicht.
Das war bei den vorherigen Versionen nicht der Fall, ist jetzt in der 4.3.0 neu. Kannst du das bitte wieder abstellen oder ist das im Moment extra so?

 

[kkapsner]

Das steht im Code irgendwo console.log - wenn die F12-Konsole nicht offen ist, ist console einfach nicht definiert und es wird ein Fehler geworfen, der den restlichen Programmablauf stopt.