I trying to setup a simple 5 star rating system and have managed to thoroughly frustrate myself. I am already using one PHP query pull from the table called "place". I have a second table labeled "vote". I have no problems with the "place" table, those elements populate just fine. The only issues is getting the Ajax requests to work with the PHP which at this time is leaving sobbing in a corner.
I been trying to use the following tutorial but for all my effort can't seem to figure out what is blocking my code from executing properly?
http://sandbox.ronggur.com/2010/01/19/jquery-tutorial-simple-ajax-star-rating-with-php-extended/
Any help is greatly appreciated.
Here's my Code
<div id="pagewrap">
<div id="widgets">
<?php
$dbc = mysqli_connect(DB_HOST, DB_USER, DB_PASSWORD, DB_NAME);
$query = "SELECT * FROM place";
$data = mysqli_query($dbc, $query)
or die("Error: ".mysqli_error($dbc));
while ($row = mysqli_fetch_array($data))
{
echo '<div class="content">';
echo '<p id="type"> ' . $row['free'] . $row['paid'] . '</p>';
echo '<div id="holder">';
echo '<div id="loc_cont"><a href="site_info.php?id=' . $row['placeId'] . '"><img id="place_logo" alt="' . $row['placename'] . '" src="' . THUMBNAILS . $row['thumb'] . '" /></a>';
echo '</div>';
echo '<div class="info">';
echo '<p id="loc">' . $row['placename'] . ' - ' . $row['city'] . '</p>';
echo '</div>';
echo ' </div>';
echo '<div class="review">';
echo '<div class="rates">';
include_once('PHP/rating.php');
#$star = fetchStar();
#echo '<h2>Star Rater - '. $row['placeId'] .'</h2>';
echo '<ul class="star-rating" id="star-rating-<'. $row['placeId'] .'"';
echo '<li current-rating-<'. $row['placeId'] .'" style="width:getRating('. $row['placeId'] .')%"><!-- will show current rating --></li>';
echo '<span id="'. $row['placeId'] .'">';
echo '<li><a href="javascript:void(0)" title="1 star out of 5" class="one-star">1</a></li>';
echo '<li><a href="javascript:void(0)" title="2 stars out of 5" class="two-stars">2</a></li>';
echo '<li><a href="javascript:void(0)" title="3 stars out of 5" class="three-stars">3</a></li>';
echo '<li><a href="javascript:void(0)" title="4 stars out of 5" class="four-stars">4</a></li>';
echo '<li><a href="javascript:void(0)" title="5 stars out of 5" class="five-stars">5</a></li>';
echo '</span>';
echo '</ul>';
echo '</div>';
echo '</div>';
echo '</div>';
}
mysqli_close($dbc);
?>
</div>
</div><!--End PageWrap div-->
<?php
if($_GET['do']=='rate'){
// do rate and get id
rate($_GET['placeId']);
}else if($_GET['do']=='getrate'){
// get rating and get id
getRating($_GET['placeId']);
}
// function to retrieve
function getRating($placeId){
$sql= "select * from vote where placeId = '".$placeId."' ";
$result=@mysql_query($sql);
$rs=@mysql_fetch_array($result);
// set width of star
$rating = (@round($rs[value] / $rs[counter],1)) * 20;
echo $rating;
}
// function to insert rating
function rate($placeId){
$text = strip_tags($_GET['rating']);
$update = "UPDATE vote SET counter = counter + 1, value = value + ".$_GET['rating']." WHERE placeId = '".$placeId."' ";
$result = @mysql_query($update);
}
?>
/
/ JavaScript Document
$(document).ready(function() {
// get rating function
function getRating(id){
$.ajax({
type: "GET",
url: "../PHP/rating.php",
data: "do=getrate&placeId="+id,
cache: false,
async: false,
success: function(result) {
// apply star rating to element
$("#current-rating-"+id+"").css({ width: "" + result + "%" });
},
error: function(result) {
alert("some error occured, please try again later");
}
});
}
// link handler
$('.rates li a').click(function(){
// get the parent id
var idStar = $(this).parent().parent().attr('id');
$.ajax({
type: "GET",
url: "../PHP/rating.php",
data: "rating="+$(this).text()+"&do=rate&placeId="+idStar,
cache: false,
async: false,
success: function(result) {
// remove #ratelinks element to prevent another rate
$("#ratelinks").remove();
// get rating after click
getRating(idStar);
},
error: function(result) {
alert("some error occured, please try again later");
}
});
});
});
Nathan, I dont have coffee with me right now so cant go through your code. But can direct you to link where something similar is available with code hints.
You can try this http://orkans-tmp.22web.net/star_rating/index.html its very easy to implement.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.