Some people ask me question about how to implement my last star rating in multiple star rating, and here is the answer on how to implement it.
1. Upgrade latest table
Since you’ll need to add ‘id’ on multiple record then we need to upgrade the existing table. Here is the full sql
01 CREATE TABLE IF NOT EXISTS `vote` (
02 `id` int(11) NOT NULL auto_increment,
03 `desc` varchar(50) NOT NULL,
04 `counter` int(8) NOT NULL default ,
05 `value` int(8) NOT NULL default ,
06 PRIMARY KEY (`id`)
07 ) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENT=3 ;
08
09 --
10 -- Dumping data for table `vote`
11 --
12
13 INSERT INTO `vote` (`id`, `desc`, `counter`, `value`) VALUES
14 (1, istar - 1, 0, 0),
15 (2, istar - 2, 0,0);
2. CSS
We still can stylesheet from the previous post. No need to modify it.
3. PHP files (index.php & update.php)
There are some code changes in this files. If in previous post we just need an html file to represent the star rating, now we need php file to do it. Here is full code for index.php and some simple code explanation in it
01 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
02 <html xmlns="http://www.w3.org/1999/xhtml">
03 <head>
04 <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
05 <title>jQuery Tutorial : Simple ajax star rating</title>
06 <meta name="Keywords" content="Star rating, jQuery, ajax">
07 <meta name="Description" content="jQuery Tutorial : Simple ajax star rating">
08 <meta http-equiv="Content-Language" content="en">
09 <meta name="robots" content="index,follow">
10 <script src="rating/jquery.min.js" type="text/javascript"></script>
11 <script src="rating/starrating.js" type="text/javascript"></script>
12 <link href="rating/starrating.css" rel="stylesheet" type="text/css" media="screen" />
13 </head>
14 <body>
15 <?php
16 // include update.php
17 include_once update.php;
18 // get all data from tabel
19 $arr_star = fetchStar();
20 ?>
21 <?php
22 // start looping datas
23 foreach($arr_star as $star){ ?>
24 <h2>Star Rater - <?php echo $star[id];?></h2>
25 <ul class= istar-rating id="star-rating-<?php echo $star[id];?>">
26 <?php /* getRating($id) is to generate current rating */?>
27 <li id="current-rating-<?php echo $star[id];?>" style="width:<?php echo getRating($star[id])?>%"><!-- will show current rating --></li>
28 <?php
29 /* we need to generate id for star rating.. this id will identify which data to execute */
30 /* we will pass it in ajax later */
31 ?>
32 <span id="<?php echo $star[id];?>">
33 <li><a href="javascript:void(0)" title="1 star out of 5">1</a></li>
34 <li><a href="javascript:void(0)" title="2 stars out of 5">2</a></li>
35 <li><a href="javascript:void(0)" title="3 stars out of 5">3</a></li>
36 <li><a href="javascript:void(0)" title="4 stars out of 5">4</a></li>
37 <li><a href="javascript:void(0)" title="5 stars out of 5">5</a></li>
38 </span>
39 </ul>
40 <?php } ?>
41 </body>
42 </html>
And this is for update.php
01 <?php
02 // connect to database
03 $dbh=mysql_connect ("localhost", "user", "password") or die (Cannot connect to the database);
04 mysql_select_db ("database",$dbh);
05
06 if($_GET[ wouldo]==
ate){
07 // do rate and get id
08 rate($_GET[id]);
09 }else if($_GET[ wouldo]==getrate){
10 // get rating and get id
11 getRating($_GET[id]);
12 }
13
14 // get data from tabel
15 function fetchStar(){
16 $sql = "select * from `vote`";
17 $result=@mysql_query($sql);
18 while($rs = @mysql_fetch_array($result,MYSQL_ASSOC)){
19 $arr_data[] = $rs;
20 }
21 return $arr_data;
22 }
23
24 // function to retrieve
25 function getRating($id){
26 $sql= "select * from vote`` where id=".$id." ";
27 $result=@mysql_query($sql);
28 $rs=@mysql_fetch_array($result);
29 // set width of star
30 $rating = (@round($rs[value] / $rs[counter],1)) * 20;
31 echo $rating;
32 }
33
34 // function to insert rating
35 function rate($id){
36 $text = strip_tags($_GET[
ating]);
37 $update = "update `vote` set counter = counter + 1, value = value + ".$_GET[
ating]." where id=".$id." ";
38
39 $result = @mysql_query($update);
40 }
41 ?>
4. Javascript
01 // JavaScript Document
02 $(document).ready(function() {
03 // get rating function
04 function getRating(id){
05 $.ajax({
06 type: "GET",
07 url: "update.php",
08 data: "do=getrate&id="+id,
09 cache: false,
10 async: false,
11 success: function(result) {
12 // apply star rating to element
13 $("#current-rating-"+id+"").css({ width: "" + result + "%" });
14 },
15 error: function(result) {
16 alert("some error occured, please try again later");
17 }
18 });
19 }
20
21 // link handler
22 $(.ratelinks li a).click(function(){
23 // get the parent id
24 var idStar = $(this).parent().parent().attr(id);
25 $.ajax({
26 type: "GET",
27 url: "update.php",
28 data: "rating="+$(this).text()+"&do=rate&id="+idStar,
29 cache: false,
30 async: false,
31 success: function(result) {
32 // remove #ratelinks element to prevent another rate
33 $("#ratelinks").remove();
34 // get rating after click
35 getRating(idStar);
36 },
37 error: function(result) {
38 alert("some error occured, please try again later");
39 }
40 });
41
42 });
43 });
That’s it! hope it works for you. You can add some modification like notification, or loader while processing.
- Download zip file jQuery Tutorial : Simple ajax star rating with php (extended) (4)
Original Source:http://sandbox.ronggur.com/2010/01/19/jquery-tutorial-simple-ajax-star-rating-with-php-extended/
Related Stuff
-
MooV: Using cutting edge Video phones and Software Video Phones - coupling all that with VoIP and empowering the disabled.
-
Moo Telecom: VoIP communications made easy - Ring anyway with the fun and ease of using a normal phone
-
TagR:Mobile Social Network with Real Time Locations Based services, and Ambience Intelligence, VoiP, IM, Skype, Googletalk, Mapping, Flickr, Events, Calendaring, Scheduling, SecondLife Support
-
ClearSMS : ClearSMS is a Web-based application that lets you send bulk SMS messages to your customers, contacts, or just about anyone.
-
Jajah:jah is a VoIP (Voice over IP) provider, founded by Austrians Roman Scharf and Daniel Mattes in 2005[1]. The Jajah headquarters are located in Mountain View, CA, USA, and Luxembourg. Jajah maintains a development centre in Israel.
-
Skype: It’s free to download and free to call other people on Skype. Skype the number one voice over ip software
- PrivatePhone: a free local phone number with voicemail and messages you can check online or from any phone.