Gelezen wat Ajax is, gelezen hoe ik libraries kan toevoegen aan het CodeIgniter framework en wat jQuery erbij geleerd. Inmiddels werkt alles zoals ik het wil. Moraal van het verhaal: gewoon zelf leren en doen.quote:Op woensdag 27 februari 2013 17:03 schreef pascal08 het volgende:
[..]
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.
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?
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.Spoiler bevat wat ik nu heb + probleem met navigatiebalk/footer: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.De site wordt verder uitgewerkt in Joomla overigens.
Alvast bedankt voor de hulp & tips.
CSS:HTML:
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
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51@charset "utf-8";
html {
height: 100%;
}
body {
margin: 0;
padding: 0;
height: 100%;
background-image:url(../images/site_bg.gif);
}
#container {
background: none;
width: 100%;
}
#main {
width: 800px;
height: 100%;
margin: auto;
}
#nav {
height: 39px;
width: 100%;
background-image:url(../images/navigatie_bg.gif);
}
#header {
width: 800px;
height: 233px;
background-image:url(../images/banner_bg.gif);
}
#content {
width: 800px;
height: 290px;
background-image:url(../images/bodygradient_bg.gif);
}
#footer {
position:absolute;
bottom:0;
width:100%;
height: 37px;
background-image:url(../images/footer_bg.gif);
}
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
30
31<<body>
<div id="container">
<div id="nav">
<jdoc:include type="modules" name="nav" style="xhtml" />
</div>
<div id="main">
<div id="header"></div>
<div id="content">
<jdoc:include type="message" />
<jdoc:include type="component" />
</div>
</div>
<div id="footer"> Footerinformatie
<jdoc:include type="modules" name="footer" style="xhtml" />
</div>
</div>
</body>
Heb nog een beetje zitten puzzelen:
#nav uit de #main gehaald zodat de achtergrond helemaal van links naar rechts kan gaan.
#content toch een negatieve margin gegeven (later weer teruggedraaid) om te kijken wat er zou gebeuren.
De bedoeling is dat #contant automatisch tot aan de footer komt ongeacht de grootte van het venster. De gradient achtergrond moet tegelijkertijd bovenin deze div blijven staan zodat de gradient van de #header/banner vloeiend kan uitlopen. Dit nog niet voor elkaar gekregen helaas
[ Bericht 1% gewijzigd door karton2 op 01-03-2013 21:14:54 ]
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.Deze code doet dus niets meer en minder dan de resultaten van een simpele query outputten in HTML, zoals jullie mij adviseerden.
Nu, met deze basiscode, wil ik de tabel kunnen updaten met inputfields en ajax.
Stel ik voeg de volgende regel toe aan de view:
1 <input type="text" id="min_col1">Minimum Kolom 1</input>
Dan zou ik via jQuery dit kunnen doen:
1
2
3
4
5
6
7
8
9$(document).ready(function() {
$('#min_col1').keyup(function() {
var min_col1 = $(this).attr('value');
if(!min_col1) {
$.post('/folder/controller/function', {min_col1:min_col1}, function(data) {
$('...').html(data);
});
}
});
Hier loop ik eigenlijk een beetje vast. Moet ik nu een nieuwe functie maken in m'n controller die een HTML-tabel gaat genereren?
quote:Op dinsdag 5 maart 2013 14:24 schreef pascal08 het volgende:
Ik loop nu al een tijdje te kloten met mijn tabel. Met Datatables kwam ik een heel eind, maar was toch te beperkt en te ingewikkeld voor iets ogenschijnlijk simpels: een tabel met voor iedere kolom een minimum en maximum criteria in de vorm van een inputbox. Ik wil de tabel aan de hand van deze criteria updaten zonder page reloads en volgens mij is ajax daar de beste oplossing voor.
Voor de duidelijkheid:
- Ik maak gebruik van het CodeIgniter PHP framework.
- Ik heb een SQL-tabel met ~12.000 records en 50+ kolommen.
- Deze tabel wil ik absoluut niet in 1 keer outputten in HTML. Door middel van tabjes wil ik bepaalde kolommen tonen of juist verbergen. Met pagination wil ik een overzichtelijk aantal rijen tonen.
Dit is mijn ultieme poging om het toch nog voor elkaar te krijgen, want inmiddels ben ik er al 2 weken mee bezig en stuit ik iedere keer op een ander vervelend probleem. Vandaar dat ik helemaal opnieuw wil beginnen, met de code die ik vorig week op advies van mensen hier heb gemaakt.
De volgende code die ik heb geschreven:Ik snap je hele doel niet helemaal..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.Deze code doet dus niets meer en minder dan de resultaten van een simpele query outputten in HTML, zoals jullie mij adviseerden.
Nu, met deze basiscode, wil ik de tabel kunnen updaten met inputfields en ajax.
Stel ik voeg de volgende regel toe aan de view:
[ code verwijderd ]
Dan zou ik via jQuery dit kunnen doen:
[ code verwijderd ]
Hier loop ik eigenlijk een beetje vast. Moet ik nu een nieuwe functie maken in m'n controller die een HTML-tabel gaat genereren?
Is het uiteindelijke idee nou dat je met een inputfield doormiddel van ajax een rij toevoegt aan je database tabel?
Dan kun je gewoon met AJAX een functie aanspreken in je controller die de data doorgeeft van je inputfield en dit in je model afhandelen om het in de database te zetten?Ik weet niks van Hindoes. Wel van Samoerai en andere dingen.
Nee, ik wil niets toevoegen of verwijderen. Via die inputfields wil ik bepaalde data wegfilteren. Aanvankelijk, bij het laden van de pagina, zijn er nog geen filters actief, dus worden bijvoorbeeld de eerste 30e rijen uit de SQL-tabel getoond. Als de gebruiker dan in een inputfield aangeeft dat 'ie bepaalde data met een waarde onder of boven zijn ingevoerde waarde niet wilt zien, dan moet de tabel zo aangepast worden dat er geen data meer getoond wordt die de gebruiker niet wilt zien.quote:Op dinsdag 5 maart 2013 14:31 schreef boem-dikkie het volgende:
[..]
Ik snap je hele doel niet helemaal..
Is het uiteindelijke idee nou dat je met een inputfield doormiddel van ajax een rij toevoegt aan je database tabel?
Dan kun je gewoon met AJAX een functie aanspreken in je controller die de data doorgeeft van je inputfield en dit in je model afhandelen om het in de database te zetten?
Oké, ik snap wat je zegt. Stel ik laat PHP dan in de controller-functie de query resultaten outputten en via Javascript in de tabel plaatsen, werken mijn paginatie-instellingen en tabjes dan nog wel? Die functie in de controller waar pagination wordt ingesteld, wordt dan immers niet meer gebruikt als ik een nieuwe functie maak zoals jij zegt.quote:Op dinsdag 5 maart 2013 14:58 schreef boem-dikkie het volgende:
Je kunt met AJAX meegeven welke waarde de gebruiker heeft ingevoerd en met een nieuwe functie in je controller een functie in je model aanspreken die een query uitvoert waarin je die filter hebt opgenomen?
Momentje, ik ga het proberen.quote:Op dinsdag 5 maart 2013 15:00 schreef boem-dikkie het volgende:
1. Laat alle data zien.
2. Stuur met AJAX je input naar een controller.
3. Verwerk je input en spreek een model aan.
4. Voer een query in je model uit die bijvoorbeeld zegt "laat alles zien > $filter"
5. Data terugsturen en in je HTML zetten.
Aangezien je Codeigniter gebruikt zou je gewoon ter informatie ook het filmpje op deze pagina eens kunnen bekijken: http://net.tutsplus.com/t(...)ch-day-7-pagination/quote:Op dinsdag 5 maart 2013 15:06 schreef pascal08 het volgende:
[..]
Momentje, ik ga het proberen.
EDIT:
Nja, het lukt me om via ajax de nieuwe query resultaten te laten zien, maar pagination en die "kolom"-tabs werken dan niet meer. Dit is gewoon te ingewikkeld voor mij en ik heb er ook geen plezier meer in (waar ik het voornamelijk voor doe ), dus ik laat het hierbij zitten. Bedankt voor je reactie.
Wat is het verschil?quote:Op dinsdag 5 maart 2013 20:28 schreef TwenteFC het volgende:
[..]
Aangezien je Codeigniter gebruikt zou je gewoon ter informatie ook het filmpje op deze pagina eens kunnen bekijken: http://net.tutsplus.com/t(...)ch-day-7-pagination/
Met Ajax vind ik persoonlijk wel chiquer.
Tussen Ajax pagination, en pagination op deze manier?quote:
Jezus man, kan dat ook nog?quote:Op dinsdag 5 maart 2013 20:32 schreef TwenteFC het volgende:
[..]
Tussen Ajax pagination, en pagination op deze manier?
Geen pagereloads.
Hoe bedoel je? Daar was je toch in eerste instantie mee bezig.quote:Op dinsdag 5 maart 2013 20:35 schreef pascal08 het volgende:
[..]
Jezus man, kan dat ook nog?
Dat wordt al helemaal ingewikkeld.
Volgens mij was-ie bezig met het anders sorteren van de tabel dmv Ajax. Maar soms lees ik ook iets over filteren.quote:Op dinsdag 5 maart 2013 20:36 schreef TwenteFC het volgende:
[..]
Hoe bedoel je? Daar was je toch in eerste instantie mee bezig.
Die tutorial legt de basics uit van het pagineren, als je die volgt dan snap je volgens mij iets beter waar je mee bezig bent.
Ik heb Day 16 al gevolgd van die serie. Erg informatief, maar ik krijg het als geheel niet bij elkaar: ajax-call om de tabel te refreshen, paginatie (ajax of met CI), navigatie met tabjes. Ik kan m'n probleem klaarblijkelijk ook niet goed omschrijven, want iedereen komt met wat anders.quote:Op dinsdag 5 maart 2013 20:36 schreef TwenteFC het volgende:
[..]
Hoe bedoel je? Daar was je toch in eerste instantie mee bezig.
Die tutorial legt de basics uit van het pagineren, als je die volgt dan snap je volgens mij iets beter waar je mee bezig bent.
Dan kun je het ook nooit programmeren.quote:Op dinsdag 5 maart 2013 20:38 schreef pascal08 het volgende:
[..]
Ik kan m'n probleem klaarblijkelijk ook niet goed omschrijven
quote:Op dinsdag 5 maart 2013 20:38 schreef Tijn het volgende:
[..]
Volgens mij was-ie bezig met het anders sorteren van de tabel dmv Ajax. Maar soms lees ik ook iets over filteren.
Wat ik begrijp is dat je 11.500 records hebt, die je wil tonen op een pagina per 50 bijvoorbeeld.quote:Op dinsdag 5 maart 2013 20:38 schreef pascal08 het volgende:
[..]
Ik heb Day 16 al gevolgd van die serie. Erg informatief, maar ik krijg het als geheel niet bij elkaar: ajax-call om de tabel te refreshen, paginatie (ajax of met CI), navigatie met tabjes. Ik kan m'n probleem klaarblijkelijk ook niet goed omschrijven, want iedereen komt met wat anders.
Ja, exact.quote:Op dinsdag 5 maart 2013 20:40 schreef TwenteFC het volgende:
[..]
Wat ik begrijp is dat je 11.500 records hebt, die je wil tonen op een pagina per 50 bijvoorbeeld.
En dat je deze records ook wil filteren op bepaalde eigenschappen?
Begin dan heel simpel, en maak eerst die pagination na .quote:
Forum Opties | |
---|---|
Forumhop: | |
Hop naar: |