Door
Marc -
op 05-01-2012 19:05
gewijzigd op 05-01-2012 19:06
4.744 views
Hallo!
Ik heb met php en jquery een reactie script gemaakt. Als je naar de pagina gaat worden de reacties met php uit de database gelezen en weer geven met foreach. Daar boven staan 2 knoppen; eentje om reactie's te weergeven en eentje om een reactie toe tevoegen. Als je dus op 'reactie toevoegen' klikt fadeOut() hij het div met reactie's en fadeIn() hij het div om een reactie toe tevoegen. Als je dan een reactie hebt toegevoegd en op reacties weer geven klikt fadeOut() hij het div om een reactie toe tevoegen en fadeIn() hij weer het div met alle reacties. Het probleem is alleen dan dat hij de query niet opnieuw doet en dus niet de gegevens herlaad. Hoe kan ik zorgen dat als de gebruiker op reacties weergeven klikt de query opnieuw word gedaan en dat het div wordt weergeven? ik heb al geprobeerd om met $.ajax in een ander document de gegevens uit de database te halen en dan met $('#div').html(data) te weergeven maar dat gaat mis omdat ik foreach gebruik maar dan komt het allemaal tegelijk en gaat het mis. Wie o wie kan mij helpen?
stel er zijn 5 reacties, dan krijg je dus 5 reacties te zien door foreach. als ik dat dan terug stuur en het met html(data) uitlees krijg ik in het div waar ik (data) ik plaats eigenlijk gewoon 1 reactie met alle data van (data) en in (data) staat dus een paar keer
<html>
<div></div>
</html>
en het einde van het div wordt gewoon genegeerd. Of naja ik iniedergeval:
De gegevens van (data) wil ik gewoon in het div hebben met alle div tags. dus als in (data) 3 keer:
[size=xsmall]Toevoeging op 05/01/2012 19:25:53:[/size]
en ik heb dus met css gedaan dat als je over één reactie scrolt de achtergrond een beetje verandert. Als je de data dus invoegt staat er een rij met data waarvan alle achtergronde verandert. Dus hij onderscheidt de verschillende div's niet
[size=xsmall]Toevoeging op 05/01/2012 19:26:08:[/size]
Dat komt dan waarschijnlijk omdat je een complete HTML pagina terugstuurt? Via een AJAX call kan je ook een deel sturen, of zelfs alleen maar een JSON object waarin je data zit. De HTML kan je dan opbouwen in de browser. Dit laatste is de manier die ik over het algemeen toepas, omdat je dan veel minder data hoeft te versturen (over het algemeen).
Serverside kan je dan feitelijk in een keer je array met data uit de database echo'en met dit:
<?php
echo json_encode($all_reactions_data);
?>
Client side kan je dan het beste de AJAX call maken met de JQuery functie $.getJSON(), die zorgt namelijk meteen voor een juiste conversie naar een javascript object. Dat kan je dan vervolgens gebruiken om je HTML te genereren.
In "res" komt nu je data terecht als javascript object. stel je has de volgende array als data in php:
<?php
$data = array( "elem1" => 12, "elem2" => "something", "elem3" => true );
?>
Dan kan je het in je javascript zo aanroepen: var myVar = res.elem1;
Als je dat nu in een div wilt gieten doe je het bijvoorbeeld zo:
$("#div").append("<div>"+res.elem1+"</div>");
[size=xsmall]Toevoeging op 05/01/2012 19:44:20:[/size]
Ik hoop dat het een beetje duidelijk is, anders drop hier gewoon wat je hebt en dan gaan we er stap voor stap doorheen.
oke bedankt voor de duidelijke uitleg! ik ga eventjes wat proberen (:
[size=xsmall]Toevoeging op 05/01/2012 20:34:28:[/size]
Ik keek nog eens goed en toen ontdekte ik een hele, hele domme fout had gemaakt! ik had gewoon foute div's gebruikt! ik heb het nu opgelost alleen het enige probleem is nog: op een overzichtspagina kan je dan titels aanklikken die een id meenemen. Die id doe ik vervolgens in een hidden input om ze daarna vervolgens mee te sturen met $.ajax. Wat ik ook bij andere functie doe met $.ajax. Alleen nu zegt hij: undefined index. terwijl het 100% klopt!
en klopt het dat dit werkt met foreach en dan append ipv html. Of zal ik toch jou manier gebruiken zoals je hierboven beschrijft?
[size=xsmall]Toevoeging op 05/01/2012 20:39:19:[/size]
want dan heb ik dus dit:
(dit als functie en die functie dan in de lus als 'reactie weergeven' is geklikt
<script type="text/javascript">
Lees ik door alle vragen heen, is het niet meer nodig :-)
Op zich zie ik niets mis met jouw manier. Het enige punt waarom ik voor mijn manier heb gekozen is dat het minder data verstuurt, maar dat maakt het zeker niet beter. Aan de andere kant, mocht je ooit eens je HTML willen aanpassen dan hoef jij het alleen in je php scripts te doen, terwijl je met mijn manier ook je javascript files moet aanpassen. Kwestie van keuze dus. Als het werkt zoals je het nu doet zou ik het gewoon zo laten.
[size=xsmall]Toevoeging op 06/01/2012 18:20:14:[/size]
ik kom net achter een probleem: de tekst gaat nu dwars door de div heen
dus:
| dit is een div met te|kst en de gaat hier verder
| |
ipv
| dit is een div met tekst |
| en de tekst gaat hier |
| verder |
heeft het iets met foreach te maken?
[size=xsmall]Toevoeging op 06/01/2012 18:30:45:[/size]
en als ik dan gewoon droog even alle code verwijder en dan de div's die in de foreach staan er met de hand in zet werkt het wel gewoon? heeft iemand een idee?
[size=xsmall]Toevoeging op 06/01/2012 21:15:30:[/size]