[SQL/PHP] Uitklapbare tabel met afhankelijke informatie

[jerpsx]

Mijn vraag
Ik ben een beetje aan het hobby'en met PHP en SQL, nu probeer ik het volgende voor elkaar te krijgen, maar ik loop even vast.

Het lukt om een simpele tabel op te halen en weer te geven.

Nu wil ik dat ik, zodra ik een van de rijen aanklik, de tabel uitklapt met extra info (die ook weer uit dezelfde database komt). Ik mis even aanknopingspunten hoe ik dit voor elkaar kan krijgen. Het uitklapbare gedeelte moet dus afhankelijk zijn van de waarde in een van de cellen.

Voorbeeldtabel in Excel (met data waar vergelijkbaar probleem zou kunnen ontstaan):

Linker tabel krijg ik voor elkaar. Ik wil dat zodra ik rij 3 aanklik (met de order van Jan), de tabel uitklapt en de vorige orders van Jan laat zien (dus rechter tabel). Later dan mischien ook gemiddelde orderwaarde of totaal enz. maar eerst dit oplossen

Hoe kan ik dit voor elkaar krijgen in PHP/SQL?




Relevante software en hardware die ik gebruik
Denk niet hele relevant..maar draai XAMPP lokaal (laatste versie)

Wat ik al gevonden of geprobeerd heb
Googlen! Maar ik zit denk ik met de verkeerde keywords, "subtable" "table within table" "expendable table" enz. geven mij niet echt wat ik zoek.

[thaicecube]

Het showen/hiden van de tabellen lijkt mij eerder iets dat je met css/javascript moet oppakken dan echt met php. Dus dat word je eerste stap in deze case gok ik.

De data die je daarin weergeeft haal je dan wel weer op met php.

[Rannasha]

De uitvoering van dergelijke functionaliteit zit vooral aan de kant van de client (dus HTML, CSS, JavaScript) en niet zozeer aan de kant van de server (PHP, SQL).

Er zijn 2 manieren om dit aan te pakken. De eerste methode is om direct alle data te laden en in een tabel te stoppen. Vervolgens verberg je met CSS de subtabellen. Met JavaScript koppel je een onclick-event aan het tonen van de relevante subtabel. Zoek hiervoor op tutorials over JavaScript, onclick events en het verbergen en tonen van elementen door middel van CSS.

Deze methode is conceptueel eenvoudig en reageert ook lekker snel in de browser (er hoeft geen data te worden ingeladen na een klik), maar als er veel data is, dan ben je in eerste instantie wel heel veel data aan het inladen.

De tweede methode is om de data van de subtabel pas op te halen wanneer de gebruiker op een rij klikt. Wanneer dat gebeurt stuurt de browser, via JavaScript, een verzoek naar de server, waar een PHP methode klaar staat om de gewenste data uit de database op te hengelen. De server stuurt de data terug naar de browser, waar deze via JavaScript op de juiste plek in het document wordt gestopt. Deze techniek staat ook wel bekend als AJAX en een combinatie van AJAX en PHP maakt voor een goede zoekopdracht om te beginnen.

Deze tweede methode is wat ingewikkelder om te leren (maar daarom ook wat interessanter, wat mij betreft), maar je bent wel een stuk flexibeler. Daarnaast werkt het veel beter als er potentieel veel data in subtabellen kan zitten, want met deze methode haal je alleen de data op die echt nodig is.

[jerpsx]

Thanks voor de antwoorden! Ik denk dat ik inderdaad in de verkeerde hoek zat te zoeken, met de keywords AJAX en oplossingen met Javascript kom ik al wat verder. Ik ga er even mee aan de slag.

Inderdaad dacht ik ook aan een oplossing waarbij de data pas wordt opgevraagd na de klik, maar misschien eerst eens kijken of ik de eerste manier voor elkaar kan krijgen.

[jerpsx]

Ik ben inmiddels wat verder, maar nog niet helemaal waar ik wil zijn

Het lukt me nu bijv. om dynamisch data op te halen (zoals linker tabel), en daaronder een uitklapbare rij te krijgen met statische data (om het concept even werkend te krijgen).

Heb hierbij dit filmpje gebruikt:
YouTube: How to expand and collapse table rows with JQuery

Ik wil eerst de versie werkend krijgen die Rannasha als eerste optie beschreef (alle data direct inladen, en vervolgens bepaalde rijen verbergen)

Waar ik nu op vastloop is de mySQL query, die de data in de juiste volgorde juist weergeeft. Door middel van de Partition By clause lukt het wel om alle orders per persoon te groeperen en ordenen, maar het probleem waar ik dan tegenaanloop is dat de tabel primair gesorteerd moet zijn aan de hand van de meest recente orders (dus de groene cellen in het voorbeeld).

Hoop dat mijn probleem nog een beetje te volgen is ben benieuwd wat voor mogelijke oplossing jullie hier zien.

Edit:
Inmiddels ben ik eruit, met wat knutselen met de ROW_NUMBER() en FIRST_VALUE() functie heb ik de data nu zoals ik het nodig heb, en kan ik uit/inklappen zoals ik wil problem solved!

[ Voor 8% gewijzigd door jerpsx op 30-04-2019 12:55 ]