Unobtrusive AJAX Star Rating Bar
This script is no longer supported.
Download and use this script at your own risk. There is no support offered in any way, shape or form. Best of luck using this script. Thank you!
What It Is
This is a rating bar script done with PHP and mySQL that allows users to rate things like can be done on Netflix or Amazon, all web 2.0-like with no page refresh. It is a major improvement on the previous version because it is now unobtrusive, meaning that if Javascript is off it will still work (although the page will refresh). You can also set the number of rating units you want to use (i.e. 4 stars, 5 stars, or 10 stars) on a rater to rater basis (see samples below or read the docs). A few other changes were made as well – see the docs for details. Note that this script isn’t tied to any specific system (such as WordPress), so you should be able to adapt it to your situation without too much trouble. What are you waiting for? Check the demos.
Based on work found at Komodo Media and Climax Designs. There is also another AJAX version of a rater on this page: Yvo Schaap
Good people of the Internet: This work is licensed under a Creative Commons Attribution 3.0 License. Please give credit where it is due, whether it is to me or the people upon whose work I based this script, and don’t claim this work as your own! Please consider making a donation – even $0.50 or a buck. That would be so freaking cool of you. Donate button located below.
If you have any problems downloading the file, first make sure you don’t have any over-crazy firewall protection on. When you can’t grab the file that is USUALLY the culprit. And you have to download it from this domain. I don’t like direct links from other sites. If that doesn’t work, .(JavaScript must be enabled to view this email address).
Whatchoo Talkin’ ‘Bout
v 1.2.2 Updates (March 18, 2007):
Sorry for the quick release between version 1.2.1 and version 1.2.2. I needed to update the script this page was actually using (it was still using the oldest version) because someone kept farting around with the ratings here. Hopefully, that won’t happen now that this page is using the newest version of the script. Also, because I’m running this site with Wordpress, I found it was a pain in the arse to go in and change the DB queries manually, so I just altered the script to work with Wordpress out of the box by changing what needed to be changed.
- Added: prefixed DB calls with $rating_dbname for better separation from other scripts. This will really help with Wordpress installs – As of 1.2.2 – I don’t think you need to do any special tweaks any longer.
- Updated: changed some variable names so as not to confuse with other scripts
With a Little Help From My Friends
HEY MONKEYBOY. YEAH, YOU. One very good reason that I DO NOT offer tech support on this script, offer CSS lessons, teach HTML, or give anyone any idea how to fix this silly thing in IE 6 – all things that google is so good at if you know how to type, is because I make next to nothing on this script.
I spent a lot of spare time polishing this thing up and trying to make it more useful. If the late nights I spent tearing my hair out trying to determine why Internet Explorer won’t allow dynamic insertion of an “onclick“ into a link using setAttribute has saved you any time at all, or if you just think it looks purty, consider a little donation. C’mon, you know there must be a couple bucks just sitting in your PayPal account that you’ve forgotten about!
Whither Wall of Fame & Live Samples?
These have been quietly removed. All I got was an inbox full of needy people looking for linkage to their site, that may or may not have been shoddy, and may or may not have actually used the rater in such a way that it looked good. There was way more noise than signal there, and I didn’t need the headache. Thanks to everyone who has donated in the past, and will donate in the future. It’s much appreciated!
Comments are closed for the Star Rater!
Sorry, but comments have been closed for this script. Pretty much all the info you need to fix or upgrade the Star Rater version 1.1 is found in the existing comments. And again, sorry if you feel like you're getting dissed, but I can't offer help on this script. I just can't. I can't give lessons in CSS, either. I may be able to pop in on the forums from time to time. Thanks for your understanding.
300 Comments
Sorry, comments are closed.
September 14th, 2006
Just a follow up on my previous question on IP lockout for your information. I have worked around the problem by using cookies instead, even that this seemed like an obvoius solution, I didn’t really think about it in combination with AJAX. So I am setting a cookie when the request is sent to the server, the response changes the rater no “thanks for your vote”, and when drawing the rater I check for the cookie rather than for the IP. This solution allows multiple people behind a company firewall to vote one time each rather than just once for the entire company.
September 16th, 2006
works well on firefox. IE shows the rating but not from left to right like it should be arranged. It just takes a place within my 10 stars (my vote of 3 for example). Any one experiencing this. Overall, very good job.
September 16th, 2006
I am having a problem in that when a rating is made it reloads the browser everytime, no matter the browser, or if Java is enabled or not.
Any thoughts on what might be causing this and a solution?
September 18th, 2006
Dan, what code did you change to use cookie based lockout vs. ip lockout? Could you make that publicly available? :)
September 18th, 2006
Hello,
First of all, awesome script. Thanks! It was exactly what I was looking for.
I installed the script using a ‘standard’ installation, however the star graphics appear a little off on the page, but look fine when you hover over them. Could anyone guide me in the right direction to fix this?
September 18th, 2006
i’m also interested in the cookie lookout. ip doesn’t work well, in spite of i have tons of double votings from the same ip? whats the matter?
September 18th, 2006
well readme file s.ucks but script is awesome.I will use it ;) thanks
September 20th, 2006
If you want to show exact values with 0.5 precision: 0 0.5 1 1.5 ... 4.5 5 so that the image looks smoother you can use
(round((@number_format($current_rating/$count,2) *2),0)/2)*$unitwidthSeptember 22nd, 2006
I am getting the same problem as Billy. When I click on a star it just sits there and does not write to the database. I am sure that the paths to db.php and rpc.php are linked to correctly. This may be a stupid questions but would permissions have anything to do with this. Please take a look at it: <a> www.grubreview.com/rater </a> Thanks!
September 22nd, 2006
For those who have asked about the cookie based “has voted” implementation, below you can see the two changes I made to make it work for me.
The cookie is set by the javascript making the rpc call (I am aware that this has the side effect that if the request does not go through, then the user will be blocked from voting afterwards)
The drawrating script was just modified to check for the cookie rather than checking the IP in the database.
Hope you find this useful. Improvements are welcome :-)
Regards
Dan
rating.js (set the cookie when casting the vote)
-------------------------------------------------
function sndReq(vote,id_num,ip_num,units) {
var theUL = document.getElementById('unit_ul'+id_num); // the UL
// switch UL with a loading div
theUL.innerHTML = '';
xmlhttp.open('get', 'rpc.php?j='+vote+'&q='+id_num+'&t='+ip_num+'&c='+units);
xmlhttp.onreadystatechange = handleResponse;
xmlhttp.send(null);
var cookieName = 'rater_' + id_num;
var cookieValue = '' + vote;
var today = new Date();
var expire = new Date();
nDays=30;
expire.setTime(today.getTime() + 3600000*24*nDays);
document.cookie = cookieName+'='+escape(cookieValue)
+ ';expires='+expire.toGMTString();
}
_drawrating.php (check if voted by looking at cookie)
-------------------------------------------------------
// determine whether the user has voted, so we know how to draw the ul/li
//$voted=mysql_num_rows(mysql_query("SELECT used_ips FROM $tableName WHERE used_ips LIKE '%".$ip."%' AND id='".$id."' "));
if ( $_COOKIE[ "rater_$id" ] ) {
$voted=$_COOKIE[ "rater_$id" ];
} else {
$voted=0;
}
September 22nd, 2006
@Dan
is it possible both cookie and ip implementation ?(Well of course its possible ,i mean how it will be :D )
September 23rd, 2006
the script works till it needs to insert the data into the db…
Tell us how to insert…
i`ve tried all of the suggestion but nothing changed. at first i had the spin stop and now i get thanks but no db insert.
what to do?
September 25th, 2006
Got it to work.
September 25th, 2006
Hello everyone here !
I would like to ask a little help to everyone who manage to make the jax rating bar works with wordpress. I took me 10sec to make it work on a standalone page but in wordpress, i’am trying since a week now, and still no results…
Would it be possible for anyone to send me the wordpress files that need to be chnaged WITH the changes already made in them so i can see what’s the fuck i’am doing bad…
Email : guilamu at gmail dot com
Thank you very much !
September 26th, 2006
Hey Dan. Please contact me on manilodisan at gmail.com because I need a good flash developer and I like your material. Make a price in mind for 3 X 728/90 flash banners. thanks.
September 26th, 2006
Hey could someone help me with this scirpt because i can’ t connect the DB.
Here’s an exampla game page:
http://www.game-console.nl/game-513-The-Simpsons.html
Hey Justin how did you get it to work with DB.
September 27th, 2006
Hello again everyone !
Please forget my last message.
I finaly manage to make the ajax rating bar works in wordpress. There are holes and errors in the explaintions gave here so i’ll make a full tutorial as soon as i got the time to make it.
Cya all !
September 27th, 2006
Hi there, thanks for great work, its exactly what i was looking for. Just one question: what is the reason for stroring vote info in one row by each item id? Altough im not good at scripting i’ve managed to alter sql and scripts to work with
CREATE TABLE `ratings` (`id` varchar(20) NOT NULL default '',
`value` int(11) NOT NULL default '0',
`ip` varchar(15) default NULL,
`usr_id` int(11) NOT NULL default '0',
`date` datetime NOT NULL default '0000-00-00 00:00:00'
) TYPE=MyISAM;
Each vote is recorded as separate line. In _drawRating.php votes count & values total are counted dynamicaly - one can make rating statistics by days, users etc. If some1 interested email me.
September 28th, 2006
I’ve just tryed this :
To remove the rater’s ID from the output, you have to change a couple things. In _drawrating.php, about line 45, change this:
. Rating:
to this:
Rating:
And in rpc.php, about line 66, change this:
“$id_sent. Rating:
And it doesn’t work at all, the id number is always here.
Any clue ? Thnaks a lot !
Rating:
September 28th, 2006
You can forget my last comment again… I was modifying files not in the good directory… Ryan can you dleete those 2 comments please ? thanks.
September 29th, 2006
OK, I was playing around with this script and I used the script that Wax0r made (no need to manually enter ID’s into database), but I noticed that when you hit refresh you can vote again, which could pose as a problem. So I combined the two code snipits and I got a frankenstein monster… That just happens to work.
I’m no programer, so if you can see something in here that’s bad just tell me :)
//Code
function rating_bar($id,$units=’‘) {
// get the db connection info
require(‘_config-rating.php’);
//set some variables
$ip = $_SERVER[‘REMOTE_ADDR’];
if (!$units) {$units = 10;}
$query=mysql_query(“SELECT total_votes,
total_value, used_ips FROM $tableName
WHERE id=’$id’ “) or die(” Error: “.mysql_error());
$numbers=mysql_fetch_assoc($query);
//how many votes total
$count=$numbers[‘total_votes’];
//total number of rating added together and stored
$current_rating=$numbers[‘total_value’];
//plural form votes/vote
$tense=($count==1) ? “vote” : “votes”;
$voted=mysql_num_rows(mysql_query(“SELECT used_ips
FROM $tableName WHERE used_ips LIKE ‘%”.$ip.”%’
AND id=’”.$id.”’ “));
if (!mysql_num_rows($query)) { //This is the edit
$sql = “INSERT INTO $tableName (`id`,
`total_votes`, `total_value`, `used_ips`)
VALUES (’$id’, ‘0’, ‘0’, ‘’)”;
$result = mysql_query($sql);
}
//Code
</pre>
September 29th, 2006
Hello all !
Now i’am an “ajax rating bar” master (lol), I would like to make something :
I would need a rating bar that makes the average of two others.
Example :
rating bar id 1. (7/10) (450 votes)
rating bar id 2. (9/10) (380 votes)
Rating bar id 3 is going to be the average of the 2 others (can i make it unclickable, so that none rate in it directly ?) :
rating bar id 3. = (id1+id2)/2 (450+380 votes)
Expected result :
rating bar id 3. = 8/10 (930 votes)
Thnaks a lot to all the community !
September 29th, 2006
Hello all !
Now i’m an “ajax rating bar” master (lol), I would like to make something :
I would need a rating bar that makes the average of two others.
Example :
rating bar id 1. (7/10) (450 votes)
rating bar id 2. (9/10) (380 votes)
Rating bar id 3 is going to be the average of the 2 others (can i make it unclickable, so that none rate in it directly ?) :
rating bar id 3. = (id1+id2)/2 (450+380 votes)
Expected result :
rating bar id 3. = 8/10 (930 votes)
Thnaks a lot to all the community !
September 29th, 2006
Hello all !
Now i’m an “ajax rating bar” master (lol), I would like to make something :
I would need a rating bar that makes the average of two others.
Example :
rating bar id 1. (7/10) (450 votes)
rating bar id 2. (9/10) (380 votes)
Rating bar id 3 is going to be the average of the 2 others (can i make it unclickable, so that none rate in it directly ?) :
rating bar id 3. = (id1+id2)/2 (450+380 votes)
Expected result :
rating bar id 3. = 8/10 (930 votes)
Thanks a lot to all the community !
September 29th, 2006
Sorry for flooding, firefox bug…
September 30th, 2006
Hello everyone, it’s me again !
Since my site is not launched, googlebot already found me and it is voting !!!
a:16:{s:13:“66.249.66.107”;i:7;s:13:“66.249.66.107”;
i:8;s:13:“66.249.66.107”;etc…
And what’s strange too it’s that google can vote so many times… how is this possible ? Me, when i make a vote i can’t vote again !
Anyone got and idea? Thanks a lot !
September 30th, 2006
I have a site with a huge database of almost 1000 restaurants in my country, and i think it would be a good ideea to add this rating system to each of this restaurants. The only problem now is that i would like to add in the database not the user ip, but the username, which comes from the session. Anyone got any ideea of how could i change the code to do this?
October 01st, 2006
I like the idea of using a cookie based lockout system, but it isn’t overly practical for my site which has some 2500 ratable items. :)
@Dave:
Yeah I also added a simple protection feature that makes sure the same ip isn’t voting again. You could also setup a return message (I replace the ‘thanks for voting’ with a ‘only one vote per image’ line).
@Guilamu:
That doesn’t sound really hard, I would just put the drawrating stuff into a function and when rendering the average rating bar use a different query and not displaying the links with some simple if statements.
Also, you might like to try adding rel=“nofollow” to your voting links code (look in the draw ratings file) so that googlebot doesnt follow your voting links.
October 01st, 2006
I have tried a fresh install this script on 3 different servers and I can never get the ratings to save in the DB. It seems a lot of people are having this problem when I read thru the comments. Can anyone help with this? I got past the incorrect mysql syntax in the readme file but I can’t get it to work even though I get no mysql errors. I really want to try this.
Thanks for any help!!!!!
October 01st, 2006
after installing, i vote but it just say :
1. Rating: 4.0/5 ( votes cast) Thanks for voting!
shouldnt it be ???
1. Rating: 4.0/5 (1 vote cast) Thanks for voting!
also, when i refresh the page my vote is gone and i can vote again
has aone had this issue ?