Terugkeren naar positie in een tabel
Ik ben nieuw dus schiet me niet dadelijk af als ik fout doe maar zeg me gewoon wat er fout is.
Ik programmeer wat als hobby en al een hele tijd ben ik opzoek naar het volgend probleem.
Ik heb bv een tabel met 26 rijen waarvan je slechts 10 rijen kunt zien.
vb: rij 1 met data A
rij 2 met data B
rij 3 met data C
rij 10 met data J
nu scrol ik naar beneden naar rij 26 met data Z.
Als ik nu klik op deze rij om gegevens op te halen voor data Z wordt de pagina herladen om de gegevens van Z op te halen maar mijn tabel begint terug van rij 1.
Hier wil ik graag dat deze terug naar regel 26 keert zodat ik niet weer naar beneden moet scrollen.
Alvast bedankt.
Code (php)
1
2
3
4
2
3
4
<table>
<tr id='rij1'>...</tr>
<tr id='rij2'>...</tr>
<tr id='rij3'>...</tr>
<tr id='rij1'>...</tr>
<tr id='rij2'>...</tr>
<tr id='rij3'>...</tr>
Dan kun je vanaf "de andere pagina" naar de juiste rij terugspringen door "#rij{id}" (met {id} = het betreffende ID) achter de link te plaatsen. Dus stel dat je overview.php hebt, en van daaruit ben je naar detail.php?id=26 gesprongen (= vanaf rij 26), dan kun je weer terug naar de juiste plek in het overzicht via:
Code (php)
1
header('Location: overview.php#rij26');
Zou je me hiervan een vb. kunnen geven Thomas?
Alvast bedankt voor de moeite.
In mijn geval maak ik gebruik van jQuery, specifiek de functie scrollTop(). Op het moment dat je een klikactie uitvoert voeg je de waarde hiervan toe aan de aangeroepen URL. Op het moment dat je de pagina laadt vis je deze waarde weer uit de URL via PHP, en met deze waarde in PHP initialiseer je JavaScript-functionaliteit om weer terug te scrollen naar de verticale positie.
Wat je natuurlijk ook kunt doen is dat als je naar beneden scrollt dat er op de achtergrond meer items worden ingeladen, in dat geval hoef je de pagina nooit te verversen. Dit vergt wat meer techniek (JavaScript, AJAX-calls en wat PHP-hulpbestanden voor het serveren van de data), maar dan heb je ook wat. In het verleden is zo'n topic al een keer de revue gepasseerd (interne link).
Gewijzigd op 15/05/2020 15:39:22 door Thomas van den Heuvel