DIG Digital Corner
Alles wat je altijd al over computers, hardware, software, internet en elektronische gadgets had willen weten, maar niet op Tweakers.net durft te vragen.
Heeft iemand hier wel eens met DataTables gewerkt? Ik vind het een ontzettend goed project, maar wel enorm ingewikkeld. 
Ik maak gebruik van server-sided processing en ik wil aan elke rij een link hangen. Ik heb al de hele dag wat aangekloot en gegoogled en ik heb 't een en ander daardoor werkend gekregen.
Kan iemand mij vertellen hoe ik href-tags om de row-tags krijg?
Mijn script dat DataTables activeerd:
aData[0] bevat een uniek nummer voor elke rij en is onderdeel van de link.
EDIT:
Ik heb de volgende oplossing die in ieder geval werkt. Heeft iemand een betere?
[ Bericht 1% gewijzigd door pascal08 op 25-02-2013 22:22:50 ]
Ik maak gebruik van server-sided processing en ik wil aan elke rij een link hangen. Ik heb al de hele dag wat aangekloot en gegoogled en ik heb 't een en ander daardoor werkend gekregen.
Kan iemand mij vertellen hoe ik href-tags om de row-tags krijg?
Mijn script dat DataTables activeerd:
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 | <script type="text/javascript" charset="utf-8"> $(document).ready(function() { var oTable = $('#datatables').dataTable({ "aoColumnDefs": [{ "aTargets": [0], "bVisible": false }], "sDom": "Rlfrtip", "bDeferRender": true, "sPaginationType": "bootstrap", "sScrollY": "1000px", "sScrollX": "400px", "bProcessing": true, "bServerSide": true, "sServerMethod": "GET", "sAjaxSource": '<?php echo base_url(); ?>main/getTable', "iDisplayLength": 50, "aLengthMenu": [[10, 25, 50], [10, 25, 50]], "aaSorting": [[0, 'desc']] }); $("#datatables tbody tr").live('click',function(){ var aData = $('#datatables').dataTable().fnGetData(this); alert(aData[0]); }); }); </script> |
aData[0] bevat een uniek nummer voor elke rij en is onderdeel van de link.
EDIT:
Ik heb de volgende oplossing die in ieder geval werkt. Heeft iemand een betere?
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 | <script type="text/javascript" charset="utf-8"> $(document).ready(function() { var oTable = $('#datatables').dataTable({ "aoColumnDefs": [{ "aTargets": [0], "bVisible": false }], "sDom": "Rlfrtip", "bDeferRender": true, "sPaginationType": "bootstrap", "sScrollY": "1000px", "sScrollX": "400px", "bProcessing": true, "bServerSide": true, "sServerMethod": "GET", "sAjaxSource": '<?php echo base_url(); ?>main/getTable', "iDisplayLength": 50, "aLengthMenu": [[10, 25, 50], [10, 25, 50]], "aaSorting": [[0, 'desc']] }); $("#datatables tbody tr").live('click',function(){ var aData = $('#datatables').dataTable().fnGetData(this); window.location = 'http://../'+aData[0]; }); }); </script> |
[ Bericht 1% gewijzigd door pascal08 op 25-02-2013 22:22:50 ]
EDIT:
Niemand?
Ik zal m'n vraag even inkorten.
Ik wil dit filtersysteem overnemen: http://www.datatables.net/examples/plug-ins/range_filtering.html . Ik heb beide stukken code tussen <script>-tags gezet tussen de <head>-tags, maar het werkt niet. In de spoiler is m'n code te vinden.
Mijn JS-kennis is echt belabberd, dus ik zoek eigenlijk gewoon iemand die mij gewoon hapklaar het antwoord kan geven.
Niemand?
Ik zal m'n vraag even inkorten.
Ik wil dit filtersysteem overnemen: http://www.datatables.net/examples/plug-ins/range_filtering.html . Ik heb beide stukken code tussen <script>-tags gezet tussen de <head>-tags, maar het werkt niet. In de spoiler is m'n code te vinden.
Mijn JS-kennis is echt belabberd, dus ik zoek eigenlijk gewoon iemand die mij gewoon hapklaar het antwoord kan geven.
SPOILEROm spoilers te kunnen lezen moet je zijn ingelogd. Je moet je daarvoor eerst gratis Registreren. Ook kun je spoilers niet lezen als je een ban hebt.
[ Bericht 0% gewijzigd door pascal08 op 26-02-2013 19:30:09 ]
Ik begrijp niet helemaal waar die PHP-code goed voor is. Het idee is toch dat je alle data aan je frontend geeft en dan het filteren/sorteren in de client doet mbv DataTables? Het is toch niet de bedoeling dat het kiezen van een andere sortering of filteren zorgt voor een trip naar de server, of wel?
[edit] Ik snap op zich ook wel dat je niet 12000 rijen aan je frontend wil geven als je alleen de top 10 wil laten zien. Maar als je toch client/server-communicatie wil bij het filteren en sorteren, wat is dan het voordeel van zoiets als DataTables? Waarom laat je dan niet alle filtering/sortering doen door je backend en stop je met een Ajax-call gewoon nieuwe data in de tabel?
[ Bericht 39% gewijzigd door Tijn op 26-02-2013 21:20:22 ]
[edit] Ik snap op zich ook wel dat je niet 12000 rijen aan je frontend wil geven als je alleen de top 10 wil laten zien. Maar als je toch client/server-communicatie wil bij het filteren en sorteren, wat is dan het voordeel van zoiets als DataTables? Waarom laat je dan niet alle filtering/sortering doen door je backend en stop je met een Ajax-call gewoon nieuwe data in de tabel?
[ Bericht 39% gewijzigd door Tijn op 26-02-2013 21:20:22 ]
Volgens mij zeg je in je edit precies wat ik al vermoedde, maar dan begrijp ik nog niet waarom er custom filters mogelijk zijn waarbij je bepaalde waardes onder de ingegeven waarde kan wegfilteren.quote:Op dinsdag 26 februari 2013 21:03 schreef Tijn het volgende:
Ik begrijp niet helemaal waar die PHP-code goed voor is. Het idee is toch dat je alle data aan je frontend geeft en dan het filteren/sorteren in de client doet mbv DataTables? Het is toch niet de bedoeling dat het kiezen van een andere sortering of filteren zorgt voor een trip naar de server, of wel?
[edit] Ik snap op zich ook wel dat je niet 12000 rijen aan je frontend wil geven als je alleen de top 10 wil laten zien. Maar als je toch client/server-communicatie wil bij het filteren en sorteren, wat is dan het voordeel van zoiets als DataTables? Waarom laat je dan niet alle filtering/sortering doen door je backend en stop je met een Ajax-call gewoon nieuwe data in de tabel?
Zover ik uit de PHP-code kan opmaken is dat alle rijen worden opgevraagd. Mij lijkt het dus dat er 2 opties zijn:
- de rijen worden niet meer opgevraagd middels een aanpassing in de sql-query (back-end)
- de rijen worden niet meer getoond, maar zijn wel ingeladen (front-end)
Het grote euvel is dat ik eigenlijk te weinig kennis wat van dit soort ingewikkelde constructies. Ik ben nu dus eigenlijk heel brutaal aan het vragen om hulp. Ik ben absoluut bereid van alles en nog wat te lezen en te leren hiervoor, maar ik weet gewoon niet waar ik moet beginnen.
Wat is precies de data die je wilt tonen? Waarom wil je een datatable gebruiken? Wat is er mis met een normale table 
?
Laten we eerst eens duidelijk zien te krijgen wat je input is en wat je wilt bereiken.
?Laten we eerst eens duidelijk zien te krijgen wat je input is en wat je wilt bereiken
.
2000 light years from home
Wat enorm helpt is het probleem opdelen in kleinere problemen. Niemand kan in 1x een groot probleem oplossen, maar als je het opdeelt in kleinere problemen, wordt het een stuk beter te overzien.
Het helpt ook om je probleem goed te omschrijven, omdat eigenlijk je probleem in woorden uitleggen niet zo heel anders is dan het in code opschrijven.
Dus vertel, wat is precies de bedoeling? Wat voor data heb je, wat wil je tonen en wat wil je dat de gebruiker met deze data kan doen?
Het helpt ook om je probleem goed te omschrijven, omdat eigenlijk je probleem in woorden uitleggen niet zo heel anders is dan het in code opschrijven.
Dus vertel, wat is precies de bedoeling? Wat voor data heb je, wat wil je tonen en wat wil je dat de gebruiker met deze data kan doen?
In aanvulling op Tijn zou ik je alleszins aanraden dit eerst eens te bouwen met klassieke technieken. Gewoon een simpele query maken met een limit en order by statement en html outputten.
Juist, daar gaat 'ie dan:
Wat heb ik:
Ik heb een SQL-table met 11.500 entries. Mijn site is opgebouwd met het CodeIgniter framework.
Wat wil ik:
Een tabel die records uitpoept op basis van de wensen van de gebruiker. In eerste instantie zal de gebruiker nog niets hebben ingevoerd. De output in de tabel zal zich direct aanpassen op het moment dat de gebruiker wenst dat er bepaalde waardes weggefilterd moeten worden.
Voorbeeld:
ID-----Dier-----Leeftijd
1------Kat------8
2------Vis------1
3------Hond-----12
4------Aap------23
5------Paard----17
De gebruiker typt in de veld minimum_leeftijd: 5. Vervolgens moeten alle dieren met de leeftijd onder de 5 worden weggefilterd. Zo kan de gebruiker voor ieder veld een minimum en een maximum invoeren.
Op zich is dat natuurlijk heel makkelijk te bewerkstelligen met een simpele HTML tabel en een query in m'n PHP-code. En wat ik me nu besef is dat ik DataTables dus eigenlijk niet nodig heb. Wat ik me steeds wel afvraag is wat het grote voordeel dan is van DataTables. In eerste instantie dacht ik dat het zonder DataTables veel te intensief zou worden voor de server, maar in het aantal requests dat de server aankan heb ik me al vaker vergist.
Ik zit op dit moment niet achter mijn computer, maar zodra ik thuis ben ga ik het eens proberen zoals KomtTijd zei; gewoon met pure HTML en PHP.
Tot vanmiddag
Wat heb ik:
Ik heb een SQL-table met 11.500 entries. Mijn site is opgebouwd met het CodeIgniter framework.
Wat wil ik:
Een tabel die records uitpoept op basis van de wensen van de gebruiker. In eerste instantie zal de gebruiker nog niets hebben ingevoerd. De output in de tabel zal zich direct aanpassen op het moment dat de gebruiker wenst dat er bepaalde waardes weggefilterd moeten worden.
Voorbeeld:
ID-----Dier-----Leeftijd
1------Kat------8
2------Vis------1
3------Hond-----12
4------Aap------23
5------Paard----17
De gebruiker typt in de veld minimum_leeftijd: 5. Vervolgens moeten alle dieren met de leeftijd onder de 5 worden weggefilterd. Zo kan de gebruiker voor ieder veld een minimum en een maximum invoeren.
Op zich is dat natuurlijk heel makkelijk te bewerkstelligen met een simpele HTML tabel en een query in m'n PHP-code. En wat ik me nu besef is dat ik DataTables dus eigenlijk niet nodig heb. Wat ik me steeds wel afvraag is wat het grote voordeel dan is van DataTables. In eerste instantie dacht ik dat het zonder DataTables veel te intensief zou worden voor de server, maar in het aantal requests dat de server aankan heb ik me al vaker vergist.
Ik zit op dit moment niet achter mijn computer, maar zodra ik thuis ben ga ik het eens proberen zoals KomtTijd zei; gewoon met pure HTML en PHP.
Tot vanmiddag
11.500 records naar de frontend gooien is vragen om problemen. Gewoon een serverside selectie maken en dat aan de voorkant tonen. Zoiets als datatables is leuk tot een record of 100.
Heel veel groetjes, Catch22
En zoals mijn opa zei: "Al is het meisje nog zo mooi, haar poep stinkt ook". Rust Zacht opa..
Met GHB nooit meer nee
Storneren een optie?
En zoals mijn opa zei: "Al is het meisje nog zo mooi, haar poep stinkt ook". Rust Zacht opa..
Met GHB nooit meer nee
Storneren een optie?
Ik moet de eerste gebruiker nog tegenkomen die voor de lol 11.500 records wil zien.
Op dinsdag 13 augustus schreef Xa1pt:
Neuh, fraude mag best aangepakt worden. Maar dat het de maatschappij meer oplevert of beter is voor de samenleving, is nog maar de vraag.
Op donderdag 25 juni 2015 schreef KoosVogels:
Klopt. Ik ben een racist.
Neuh, fraude mag best aangepakt worden. Maar dat het de maatschappij meer oplevert of beter is voor de samenleving, is nog maar de vraag.
Op donderdag 25 juni 2015 schreef KoosVogels:
Klopt. Ik ben een racist.
Het voordeel van datatables is zo te zien dat het een functieset levert die ditsoort dingen een stuk makkelijker maakt. Maar zoals wel vaker geldt voor frameworks en plugins, als je de basis al niet onder de knie hebt, ga je het framework ook niet begrijpen. Beginnen bij het begin dus.quote:Op woensdag 27 februari 2013 09:50 schreef pascal08 het volgende:
Op zich is dat natuurlijk heel makkelijk te bewerkstelligen met een simpele HTML tabel en een query in m'n PHP-code. En wat ik me nu besef is dat ik DataTables dus eigenlijk niet nodig heb. Wat ik me steeds wel afvraag is wat het grote voordeel dan is van DataTables. In eerste instantie dacht ik dat het zonder DataTables veel te intensief zou worden voor de server, maar in het aantal requests dat de server aankan heb ik me al vaker vergist.
Als je dit gemaakt hebt, zou je daarna vrij eenvoudig je tabel kunnen updaten dmv AJAX. Dan heb je niet voor elke filter/sorteeractie een page request. Maar wat je sowieso moet maken is de backend.quote:
Ik zit op dit moment niet achter mijn computer, maar zodra ik thuis ben ga ik het eens proberen zoals KomtTijd zei; gewoon met pure HTML en PHP.
Wat vinden jullie van de site http://validator.w3.org/ ?
Zit even wat sites te kijken bv http://emixion.nl/
Zij maken zelf sites en dan komt dit eruit, uhhhh apart.
Result: 115 Errors, 116 warning(s)
Of is de validator heel streng?
Zit even wat sites te kijken bv http://emixion.nl/
Zij maken zelf sites en dan komt dit eruit, uhhhh apart.
Result: 115 Errors, 116 warning(s)
Of is de validator heel streng?
Die validator werkt prima, houdt zich gewoon aan de specificatie. Daar is weinig subjectiefs aan dus er bestaat niet zoiets als "heel streng" of "minder streng".
Of de errors een probleem zijn moet je natuurlijk als developer zelf bepalen.
Of de errors een probleem zijn moet je natuurlijk als developer zelf bepalen.
Dat laatste is inderdaad het belangrijkste. Het kan dus zijn dat er honderden errors zijn maar de site prima draait. Neem aan dat een site door veel errors langzamer kan zijn.
In de site van mijn werk zitten 7 kleine errors. Zal die is proberen te fixxen.
In de site van mijn werk zitten 7 kleine errors. Zal die is proberen te fixxen.
Er zitten bij die site wel een flink deel onnodige/knullige errors tussen trouwens, XHTML gebruiken en dan je tags niet afsluiten enzo 
.
SEO-technisch wil je ook zo min mogelijk errors, maar het bitneuken tot je site 100% valid is, is wel een beetje achterhaald.
. SEO-technisch wil je ook zo min mogelijk errors, maar het bitneuken tot je site 100% valid is, is wel een beetje achterhaald.
validator smellidator
ik gebruik liever een deprecated target='_blank' dan een vunzig JSje
ik gebruik liever een deprecated target='_blank' dan een vunzig JSje
Heel veel groetjes, Catch22
En zoals mijn opa zei: "Al is het meisje nog zo mooi, haar poep stinkt ook". Rust Zacht opa..
Met GHB nooit meer nee
Storneren een optie?
En zoals mijn opa zei: "Al is het meisje nog zo mooi, haar poep stinkt ook". Rust Zacht opa..
Met GHB nooit meer nee
Storneren een optie?
Ja, dat doe ik ook. Wat vooral handig is van de validator is om slordigheidjes te spotten die je anders niet waren opgevallen. En voor nieuwe ontwikkelaars is het een toegankelijkere manier om de standaard te leren kennen dan alle documenten te gaan zitten doorlezen.quote:Op woensdag 27 februari 2013 11:37 schreef Catch22- het volgende:
validator smellidator
ik gebruik liever een deprecated target='_blank' dan een vunzig JSje
Ja, dit is denk ik wat ik wil. Ik ben bijna thuis en ik kan niet wachten om aan de slag te gaan. Bij een page request wordt de hele pagina opnieuw geladen, wat intensiever is dan alleen een Ajax-call, toch?quote:
[..]
Als je dit gemaakt hebt, zou je daarna vrij eenvoudig je tabel kunnen updaten dmv AJAX. Dan heb je niet voor elke filter/sorteeractie een page request. Maar wat je sowieso moet maken is de backend.
Nauwelijks. Misschien als je een hele zware pagina hebt met veel dynamische content, maar vrijwel iedere website wisselt vloeiend van pagina zonder dat je het als gebruiker "ziet".quote:
[..]
Ja, dit is denk ik wat ik wil. Ik ben bijna thuis en ik kan niet wachten om aan de slag te gaan. Bij een page request wordt de hele pagina opnieuw geladen, wat intensiever is dan alleen een Ajax-call, toch?
Maar dan alsnog is het beter om gewoon Ajax te gebruiken in plaats van complete pagereloads toch?quote:Op woensdag 27 februari 2013 15:08 schreef KomtTijd... het volgende:
[..]
Nauwelijks. Misschien als je een hele zware pagina hebt met veel dynamische content, maar vrijwel iedere website wisselt vloeiend van pagina zonder dat je het als gebruiker "ziet".
quote:
In aanvulling op Tijn zou ik je alleszins aanraden dit eerst eens te bouwen met klassieke technieken. Gewoon een simpele query maken met een limit en order by statement en html outputten.
Oké, dat heb ik gedaan.quote:
Op Hier mijn code:
SPOILEROm spoilers te kunnen lezen moet je zijn ingelogd. Je moet je daarvoor eerst gratis Registreren. Ook kun je spoilers niet lezen als je een ban hebt.
Het is moeilijk om een soort algemeen advies te geven over wanneer je een Ajax request zou moeten doen en wanneer niet, maar ik denk dat in dit specifieke geval het wel gebruiksvriendelijker is om je table met Ajax te updaten dan elke keer de hele pagina opnieuw te laden.quote:
[..]
Maar dan alsnog is het beter om gewoon Ajax te gebruiken in plaats van complete pagereloads toch?
Maar dat wil niet zeggen dat het geen goed idee is om, zoals KomtTijd voorstelt, eerst een "ouderwetse" variant te bouwen zonder Javascript-fratsen. Die basis heb je sowieso nodig namelijk en het is ook belangrijk om iets dat je toch al een beetje ingewikkeld vindt niet nog ingewikkelder te maken dan nodig. Dat bedoelde ik ook eerder met het opdelen van je probleem in kleinere problemen. Je moet niet proberen alles in 1 keer op te lossen, maar stap voor stap af te vinken wat er gedaan moet worden.
Ik snap precies wat je bedoelt hoor. Ik heb nu door dat ik iets te snel ging, door gelijk een ingewikkeld framework te pakken zonder eerst de basis te begrijpen.quote:
[..]
Het is moeilijk om een soort algemeen advies te geven over wanneer je een Ajax request zou moeten doen en wanneer niet, maar ik denk dat in dit specifieke geval het wel gebruiksvriendelijker is om je table met Ajax te updaten dan elke keer de hele pagina opnieuw te laden.
Maar dat wil niet zeggen dat het geen goed idee is om, zoals KomtTijd voorstelt, eerst een "ouderwetse" variant te bouwen zonder Javascript-fratsen. Die basis heb je sowieso nodig namelijk en het is ook belangrijk om iets dat je toch al een beetje ingewikkeld vindt niet nog ingewikkelder te maken dan nodig. Dat bedoelde ik ook eerder met het opdelen van je probleem in kleinere problemen. Je moet niet proberen alles in 1 keer op te lossen, maar stap voor stap af te vinken wat er gedaan moet worden.
Ik heb KomtTijd z'n advies opgevolgd en een simpele model- en controller functie gemaakt met een view waar de HTML table in staat. Ik heb inmiddels een nuttige video gevonden waar het een en ander uitgelegd wordt over sorteren van tabellen etc. Ik laat zo weten hoe ver ik gekomen ben.
EDIT:
In de video zegt de maker: "It is not going to be like Ajax/Javascript trig. We are just going to reload the page, because there is hidden data that is not inside this page. So sorting with Ajax may not be a good idea here."
Ik wil nu eigenlijk van jullie wel weten wat ik het beste kan doen met betrekking tot het sorteren. Page reloads via CodeIgniter, Ajax of iets anders?
[ Bericht 6% gewijzigd door pascal08 op 27-02-2013 18:09:13 ]
| Forum Opties | |
|---|---|
| Forumhop: | |
| Hop naar: | |