Lees als je nog niet zo bekend bent met JQuery de basis van JQuery of kijk op W3Schools JQuery (onderdelen: [JQuery HOME] .. [JQuery Events] [JQuery Get] .. [JQuery css()] & [JQuery AJAX])
We gaan ratings (1-5 sterren ★★☆☆☆) toevoegen. Alle ingelogde gebruikers kunnen een rating geven aan ieder product en later die rating bijwerken.
Pas het datamodel (ERD) aan zodat deze ratings bewaard kunnen worden.
Maak een RatingCRUD aan om:
per product Id de rating (1-5) op te slaan voor deze user Id.
per product Id de rating (1-5) bij te werken voor deze user Id.
per product Id de "gemiddelde" rating op te vragen.
een overzicht van alle "gemiddelde" ratings voor alle producten op te vragen.
API (Application Programable Interface):
Maak een nieuwe controller (AJAX controller die alle AJAX verzoeken gaat afhandelen)
Pas de PageController aan dat alle verzoeken naar index.php?action=ajax ervoor zorgen dat er een AjaxController wordt aangemaakt die het verzoek verder afhandelt. dat er een AjaxController wordt aangemaakt die het verzoek verder afhandelt.
Maak een AJAX view aan die de model data als JSON terug kan geven
Bijv. een GET verzoek naar index.php?action=ajax&function=getRating&id=4 resulteert in een reactie: { "id": 4, "rating": 3.2 }
JQuery and AJAX:
Gebruik JQuery om op de webshop en detail pagina, nadatde pagina is geladen, per product een 5 sterren toevoegen waarbij het aantal ingekleurde sterren weergeeft wat de gemiddelde rating is.
Indien een gebruiker is ingelogd, kan deze ook op een ster onder het product klikken, dan gebeurt het volgende:
Voor dat product wordt de "index" van de ster als rating worden opgestuurd naar de AJAX controller. (bijv. een klik op de 3de ster onder een product, geeft voor dat product en voor die user een rating van 3)
Deze zal de nieuwe rating voor dit product toevoegen of bijwerken voor dit product, waarna hij het nieuwe "gemiddelde" rating voor dat product terugstuurt.
In javascript update je het aantal sterren met dit nieuwe gemiddelde.
Dit is een optionele opdracht, overleg met je docent of je deze gaat maken.
We gaan ratings (1-5 sterren ★★☆☆☆) toevoegen.
Alle ingelogde gebruikers kunnen een rating geven aan ieder product en later die rating bijwerken.
API (Application Programable Interface):
index.php?action=ajaxervoor zorgen dat er een AjaxController wordt aangemaakt die het verzoek verder afhandelt. dat er een AjaxController wordt aangemaakt die het verzoek verder afhandelt.index.php?action=ajax&function=getRating&id=4resulteert in een reactie:{ "id": 4, "rating": 3.2 }JQuery and AJAX:
(bijv. een klik op de 3de ster onder een product, geeft voor dat product en voor die user een rating van 3)