I’m very new to web technologies and this is basically for a term project that my team is working on. We are working on a food review site.
As of now, I’m not quite sure how to implement a simple 5-star rating system. Am I supposed to use a server-side language like PHP or a client-side one like Javascript (w/ JQuery). Looking around it seems that JQuery is more suitable for this? Or would it be a combination of both?
What I’m looking for as far as functionality goes is:
- Stars light up when mouse hovers
- Page doesn’t have to be reloaded when
a star is clicked (not really needed) - Some sort of average shown beside the
stars - Rating has to be stored somewhere in a MySQL database (Is this a good idea?)
I really apologize if the question sounds vague and stupid, I don’t have much of a clue on how to implement this and I’ve tried googling around. If you have any questions about it please let me know.
Thank you very much.
Stars light up when mouse hovers
There’s a brilliant tutorial on the web for designing a 5 star rating system: http://rog.ie/blog/css-star-rater. It’s purely CSS so no need for Javascripting.
Page doesn’t have to be reloaded when a star is clicked (not really needed)
Ajax is your friend, what I did was to have a
<a class="one_star" href="javascript: submitRating(1, 5)">where<a>represented a star and thesubmitRating()function used Ajax to transmit my rating (1/5) to the server, the server stores the rating (and assigns the user that gave the rating) and recalculates the new average rating and submit the results back in JSON format.Some sort of average shown beside the stars
Easy. Write a SQL script that, based on the product id, takes the sum of the average rating (i.e. 1/5 + 2/5 + 4/5, etc), divide it(sum) by the total amount of ratings and multiplies it by 100. Return the value back to the server, and from the server back to the client.
Rating has to be stored somewhere in a MySQL database (Is this a good idea?)
I am using MySQL for this and it works like a charm….Any DB systems is fine.