In this tutorial we will see how to make a Simple Rating System using CSS, JQuery, AJAX, PHP, MySQL. No images required to build this. It can be build using Simple CSS only. We will use JQuery, AJAX, PHP to save data in MySQL.

First let’s create a table in MySQL:

In user_id, here I am generating Unique ID based on IP of client, but ideal way will be getting user_id from database or grabing user_id from SESSION.

CSS code will be:

here we are doing the hover, and color combination using CSS only, not using any images at all.

JQuery Code goes here:

In jquery, code we are just posting ratings to PHP side. Javascript/jquery haven’t got anything to do with design of system.

Now, the HTML part:

once you will put all blocks on HTML page you will have front end ready, which will be having rating stars, greyed out one.

In PHP, here we are doing simple stuff, there are space for lot of improvements, but showcasing the least which is necessary to work rating system.

See LIVE Demo:

Live Demo

Download Files: