امتیاز دهی ستاره ای در PHP

در این آموزش شما یاد میگیرید چگونه یک سیستم امتیاز دهی ستاره ای در PHP و توسط jquery و ajax ایجاد کنید. با اسکریپت ساده ما در اخر این مقاله میتوانید یک سیستم امتیازدهی ۵ ستاره ای را در پروژه های خود پیاده سازی کنید.

قصد داریم یک سیستم امتیاز دهی ستاره ای با جی کوئری و PHP و mysql ایجاد کنیم. یک فایل rating.js برای مدیریت تمام عملیات جی کوئری ایجاد کردیم. از ajax برای ارسال امتیاز به فایل php استفاده کردیم (rating.php) . فایل rating.php داده های امتیاز دهی را داخل دیتابیس mysql ، insert یا update می کند.

از فایل های زیر برای ساخت سیستم امتیاز دهی ستاره ای استفاده کردیم.

rating.js
rating.css
dbConfig.php
index.php
rating.php

ساخت جداول دیتابیس :

post_rating برای ذخیره اطلاعات امتیاز دهی استفاده می شود. دستور sql جدول post_rating به صورت زیر است :

CREATE TABLE `post_rating` (
 `rating_id` int(11) NOT NULL AUTO_INCREMENT,
 `post_id` int(11) NOT NULL,
 `rating_number` int(11) NOT NULL,
 `total_points` int(11) NOT NULL,
 `created` datetime NOT NULL,
 `modified` datetime NOT NULL,
 `status` tinyint(1) NOT NULL DEFAULT '1' COMMENT '1 = Block, 0 = Unblock',
 PRIMARY KEY (`rating_id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;

CREATE TABLE `post_rating` (

`rating_id` int(11) NOT NULL AUTO_INCREMENT,

`post_id` int(11) NOT NULL,

`rating_number` int(11) NOT NULL,

`total_points` int(11) NOT NULL,

`created` datetime NOT NULL,

`modified` datetime NOT NULL,

`status` tinyint(1) NOT NULL DEFAULT '1' COMMENT '1 = Block, 0 = Unblock',

PRIMARY KEY (`rating_id`)

) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;

فایل rating.js و rating.css :

فایل rating.js شامل تمام کدهای جی کوئری برای سیستم امتیاز دهی است.

فایل rating.css برای استایل دهی به سیستم امتیاز دهی استفاده شده است . این دو فایل را از باکس دانلود می توانید دریافت کنید

فایل dbConfig.php :

تنظیمات اتصال به دیتابیس در این فایل قرار دارد.

<?php
//Database configuration
$dbHost = 'localhost';
$dbUsername = 'root';
$dbPassword = '';
$dbName = 'netparadis';

//Connect with the database
$db = new mysqli($dbHost, $dbUsername, $dbPassword, $dbName);
if($db->connect_errno):
    die('Connect error:'.$db->connect_error);
endif;
?>

<?php

//Database configuration

$dbHost = 'localhost';

$dbUsername = 'root';

$dbPassword = '';

$dbName = 'netparadis';

//Connect with the database

$db = new mysqli($dbHost, $dbUsername, $dbPassword, $dbName);

if($db->connect_errno):

die('Connect error:'.$db->connect_error);

endif;

فایل index.php :

حتما کتابخانه جی کوئری و فایل های rating.js,rating.css را فراخوانی کنید.

<link href="rating.css" rel="stylesheet" type="text/css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script type="text/javascript" src="rating.js"></script>

متد netparadis_rating_widget() داخل فایل rating.js موجود است . می توانید یک سری از option ها و تنظیمات را اعمال کنید.

$(function() {
    $("#rating_star").netparadis_rating_widget({
        starLength: '5',
        initialValue: '',
        callbackFunctionName: 'processRating',
        imageDirectory: 'images/',
        inputAttr: 'postID'
    });
});

$(function() {

$("#rating_star").netparadis_rating_widget({

starLength: '5',

initialValue: '',

callbackFunctionName: 'processRating',

imageDirectory: 'images/',

inputAttr: 'postID'

});

Option های دردسترس :

starLength – تعداد ستاره های قابل نمایش . پیش فرض : ۵
initialValue – مقدار پیش فرض وقتی اولین بار فایل لود می شود . پیش فرض: ۰
callbackFunctionName – بعد از کلیک بر روی ستاره های امتیاز دهی اجرا می .
imageDirectory – اسم دایرکتری تصاویر ستاره ها . پیش فرض : images

تابع processRating() را تعریف کنید. متد netparadis_rating_widget() ، post ID و امتیاز را به تابع processRating() پاس می دهد. با استفاده از Ajax ، postID و امتیاز را به فایل rating.php ارسال می کنیم.

function processRating(val, attrVal){
    $.ajax({
        type: 'POST',
        url: 'rating.php',
        data: 'postID='+attrVal+'&amp;ratingPoints='+val,
        dataType: 'json',
        success : function(data) {
            if (data.status == 'ok') {
                alert('You have rated '+val+' to NetParadis');
                $('#avgrat').text(data.average_rating);
                $('#totalrat').text(data.rating_number);
            }else{
                alert('Some problem occured, please try again.');
            }
        }
    });
}

function processRating(val, attrVal){

$.ajax({

type: 'POST',

url: 'rating.php',

data: 'postID='+attrVal+'&ratingPoints='+val,

dataType: 'json',

success : function(data) {

if (data.status == 'ok') {

alert('You have rated '+val+' to NetParadis');

$('#avgrat').text(data.average_rating);

$('#totalrat').text(data.rating_number);

}else{

alert('Some problem occured, please try again.');

}

});

}

زمانی که اولین بار صفحه بارگزاری می شود ،تمام اطلاعات امتیاز دهی از دیتابیس خوانده و نمایش داده می شود.

include_once 'dbConfig.php';
//Fetch rating deatails from database
$query = "SELECT rating_number, FORMAT((total_points / rating_number),1) as average_rating FROM post_rating WHERE post_id = 1 AND status = 1";
$result = $db->query($query);
$ratingRow = $result->fetch_assoc();

include_once 'dbConfig.php';

//Fetch rating deatails from database

$query = "SELECT rating_number, FORMAT((total_points / rating_number),1) as average_rating FROM post_rating WHERE post_id = 1 AND status = 1";

$result = $db->query($query);

$ratingRow = $result->fetch_assoc();

در html ما فقط نیاز داریم که یک فیلد input با ID و یک مشخصه (attribute) برای تعریف postID ایجاد کنیم.

&lt;input name="rating" value="0" id="rating_star" type="hidden" postID="1" /&gt;
&lt;div class="overall-rating"&gt;
    (Average Rating &lt;span id="avgrat"&gt;&lt;?php echo $ratingRow['average_rating']; ?&gt;&lt;/span&gt; Based on &lt;span id="totalrat"&gt;&lt;?php echo $ratingRow['rating_number']; ?&gt;&lt;/span&gt;  rating)
&lt;/div&gt;

(Average Rating <span id="avgrat"><?php echo $ratingRow['average_rating']; ?></span> Based on <span id="totalrat"><?php echo $ratingRow['rating_number']; ?></span> rating)

</div>

فایل rating.php :

در این فایل ما postID و امتیاز را توسط Ajax دریافت می کنیم. داخل دیتابیس بررسی میکنیم ، که اطلاعاتی در مورد امتیاز دهی در مورد POSTID ارسالی وجود دارد یا نه ، اگر وجود داشت ، پس اطلاعات و جمع امتیاز ها آپدیت می شود ، درغیر اینصورت یک سطر جدید insert می شود. در آخر تعداد امتیاز دهی و متوسط امتیاز ها از جدول post_rating با postID خوانده و در قالب فرمت داده Json برگشت داده می شود.

&lt;?php
include_once 'dbConfig.php';
if(!empty($_POST['ratingPoints'])){
    $postID = $_POST['postID'];
    $ratingNum = 1;
    $ratingPoints = $_POST['ratingPoints'];
    
    //Check the rating row with same post ID
    $prevRatingQuery = "SELECT * FROM post_rating WHERE post_id = ".$postID;
    $prevRatingResult = $db-&gt;query($prevRatingQuery);
    if($prevRatingResult-&gt;num_rows &gt; 0):
        $prevRatingRow = $prevRatingResult-&gt;fetch_assoc();
        $ratingNum = $prevRatingRow['rating_number'] + $ratingNum;
        $ratingPoints = $prevRatingRow['total_points'] + $ratingPoints;
        //Update rating data into the database
        $query = "UPDATE post_rating SET rating_number = '".$ratingNum."', total_points = '".$ratingPoints."', modified = '".date("Y-m-d H:i:s")."' WHERE post_id = ".$postID;
        $update = $db-&gt;query($query);
    else:
        //Insert rating data into the database
        $query = "INSERT INTO post_rating (post_id,rating_number,total_points,created,modified) VALUES(".$postID.",'".$ratingNum."','".$ratingPoints."','".date("Y-m-d H:i:s")."','".date("Y-m-d H:i:s")."')";
        $insert = $db-&gt;query($query);
    endif;
    
    //Fetch rating deatails from database
    $query2 = "SELECT rating_number, FORMAT((total_points / rating_number),1) as average_rating FROM post_rating WHERE post_id = ".$postID." AND status = 1";
    $result = $db-&gt;query($query2);
    $ratingRow = $result-&gt;fetch_assoc();
    
    if($ratingRow){
        $ratingRow['status'] = 'ok';
    }else{
        $ratingRow['status'] = 'err';
    }
    
    //Return json formatted rating data
    echo json_encode($ratingRow);
}
?&gt;

<?php

include_once 'dbConfig.php';

if(!empty($_POST['ratingPoints'])){

$postID = $_POST['postID'];

$ratingNum = 1;

$ratingPoints = $_POST['ratingPoints'];

//Check the rating row with same post ID

$prevRatingQuery = "SELECT * FROM post_rating WHERE post_id = ".$postID;

$prevRatingResult = $db->query($prevRatingQuery);

if($prevRatingResult->num_rows > 0):

$prevRatingRow = $prevRatingResult->fetch_assoc();

$ratingNum = $prevRatingRow['rating_number'] + $ratingNum;

$ratingPoints = $prevRatingRow['total_points'] + $ratingPoints;

//Update rating data into the database

$query = "UPDATE post_rating SET rating_number = '".$ratingNum."', total_points = '".$ratingPoints."', modified = '".date("Y-m-d H:i:s")."' WHERE post_id = ".$postID;

$update = $db->query($query);

else:

//Insert rating data into the database

$query = "INSERT INTO post_rating (post_id,rating_number,total_points,created,modified) VALUES(".$postID.",'".$ratingNum."','".$ratingPoints."','".date("Y-m-d H:i:s")."','".date("Y-m-d H:i:s")."')";

$insert = $db->query($query);

endif;

//Fetch rating deatails from database

$query2 = "SELECT rating_number, FORMAT((total_points / rating_number),1) as average_rating FROM post_rating WHERE post_id = ".$postID." AND status = 1";

$result = $db->query($query2);

$ratingRow = $result->fetch_assoc();

if($ratingRow){

$ratingRow['status'] = 'ok';

}else{

$ratingRow['status'] = 'err';

}

//Return json formatted rating data

echo json_encode($ratingRow);

}

موفق باشید

لغو پاسخ

عادل ۱۲ شهریور ۱۴۰۰

سلام بچه هایی که سورس رو تو سایتشون پیاده سازی می کنن نام دیتابیسی که تو فایل rating.php تغیرات رو اعمال میکنه یه چیز دیگس اینجا که آموزش داده نام دیتابیس post_rating هست ولی داخل rating.php(سورس) نوشته view_rating همین هیچ مشکل دیگه ای نداشت من تو سایتم خودم اجرا کردم جواب داد

پاسخ
محمد ۲۶ تیر ۱۴۰۰

من سورس رو دریافت کردم
حالا میخوام ازش استفاده کنم، فقط یک موضوع هست، چطور کاری کنم کاربر وقتی امتیاز میده و امتیازش ثبت میشه توی جدول، بعدش میانگین رای های کل رو نشون بده
با سورس شما کاربر میتونه هرچندتا ک بخواد رای بده
میخوام طوری باشه ک یکبار رای داد دیگه نتونه رای بده و میانگین رای کلی رو نشون بده بهش

پاسخ

حسن شفیعی ۲۷ تیر ۱۴۰۰

سلام.
یه کویری sql به جدول میزنید رای ها رو دریافت و بعد تقسیم بر تعداد می کنید میانگین بدست میاد.
اگر کاربر با ثبت نام در سایت امکان امتیاز دهی رو داشته باشه شما باید هر بار آیدی کاربر را از سشن دریافت و کویری به دیتابیس بزنید و ببینید اگر قبلا امتیازی ثبت کرده اجازه ثبت مجدد ندید که این مورد در سمت php با ajax انجام میشه
اگر هم بدون ثبت نام اجازه ثبت امتیاز رو میدید که در اینصورت باید بعد از ثبت یک کوکی براش ثبت کنید و بعد آیپی اون رو هم در دیتابیس کنار امتیاز ها ذخیره کنید تا امکان تقلب نباشه

پاسخ

حسن ۲۴ بهمن ۱۳۹۸

سلام ممنون از سایت خوبتون و تشکر بابت زحمات بدون چشم داشتتون…من به کمک شما مشکل قبلی رو رفع کردم ولی یه سوال دیگه داشتم.
من میتونم برای هر چند بار که بخوام نظر ثبت کنم . و این اصلا خوب نیست.چطور می تونم کاری کنم ک هرکسی فقط بتونه یک بار نظر بده؟

پاسخ

حسن شفیعی ۲۴ بهمن ۱۳۹۸

سلام. خوشحالیم که مفید واقع شده.
در فایل rating.php که درخواست ajax دریافت میشه
پس اگر امتیاز دهی توسط کاربر مهمان انجام می شود میتوانید باز مثل مرحله قبل که post_id اضافه می کردید اینبار یک ستون دیگر هم به اسم ip اضافه کنید و هنگام ثبت نظر که درخواست ajax ارسال می شود آنجا با کویری آیپی کاربر را هم در دیتابیس ذخیره کنید و دفعه بعد که کاربر دوباره قصد ثبت نظر را داشت می توانید اول قبل اینکه نظر را ثبت کنید ابتدا در دیتابیس select بزنید و اگر سطری با این آیپی فعلی پیدا شد چیزی ثبت نکنید و اگر پیدا نشد که به معنای کاربر جدید است و نظر را ثبت می کنید.
نمایش IP کاربر در PHP
اگر کاربر در سایت لاگین می کند که به جای آیپی user_id را ذخیره می کنید و اجازه ثبت نظر دوباره را نمی دیدید چون کاربر لاگین است و user_id هم در دسترس است
همچنین می توانید کوکی هم استفاده کنید که خب البته با حذف کردن کوکی های مرورگر قابل دور زدن است ولی بیشتر کاربران معمولی این مورد را نمی دانند و می توانید در کنار آیپی این اعتبارسنجی کوکی هم اضافه کنید
کار با کوکی ها در PHP
در آموزش ساخت سیستم لایک با php و ajax از کوکی برای چلوگیری از لایک زدن مجدد استفاده کردیم.
موفق باشید.

پاسخ

حسن ۲۴ بهمن ۱۳۹۸

سلام . من می خوام برای هرکدوم از پست ها نظر مرتبط با همون پست ثبت بشه.یعنی درون دیتا بیس post_id های مخصوص هر پست ثبت بشه.
باید کدام قسمت کد رو تغییر بدم

پاسخ

حسن شفیعی ۲۴ بهمن ۱۳۹۸

سلام.
در ابتدا باید داخل جدول دیتابیس یک ستون به نام مثلا post_id اضافه کنید و هنگام ارسال درخواست ajax نیز باید post_id مطلب فعلی رو دریافت و به سمت فایل php که درخواست ajax به آن ارسال می شود را اضافه کنید و در سمت php نیز مقدار post_id را از درخواست گرفته کویری sql را تغییر و مقدار post_id را برای ذخیره کردن در دیتابیس اضافه کنید.
موفق باشید.

پاسخ

mahdi ۱۰ مهر ۱۳۹۸

من دارم این کد رو یکم توسعه میدم… چیکار کنم وقتی صفحه لود میشه به صورت پیشفرض مثلا ۳ تا ستاره علامتگذاری شده باشه(زرد بشه)
برای نمایش امتیاز مطلب میخوام.

پاسخ

حسن شفیعی ۱۰ مهر ۱۳۹۸

سلام.
در کد جی کویری (… $(“#rating_star”).netparadis_rating_widget({ ) مورد نظر می توانید مقدار اولیه رو تعیین کنید
مقدار اولیه ۰ تا ۵ را می توانید به initialValue: 3, اختصاص بدید
موفق باشید.

پاسخ

mahdi ۹ مهر ۱۳۹۸

سلام. من میخوام از این کد توی قالب وردپرسم استفاده کنم اما ستاره ها نمایش داده نمیشن!
توی console مرورگر این ارور نمایش میده:
(index):129 Uncaught TypeError: $(…).netparadis_rating_widget is not a function

پاسخ

حسن شفیعی ۹ مهر ۱۳۹۸

سلام. فایل های js بدرستی لود نشدن که باید در بخش network مرورگر بررسی کنید

پاسخ

مصطفی نورزاده ۱۲ شهریور ۱۳۹۸

سلام . کلی عبارات تبدیل شده ( مثل &amp و < و … ) تو متن ها وجود داره . که با یه نگاه مشخص هست . لطفا اینها رو درست کنید

پاسخ

حسن شفیعی ۱۲ شهریور ۱۳۹۸

سلام. ممنون از توجهتون.
اصلاح شد.
موفق باشید.

پاسخ

ایوب طعنه ۱۲ آذر ۱۳۹۷

سلام ، با تشکر بابت سورس خوبتون.
۱٫ من چطور می تونم از این سورس کد طوری استفاده کنم که بجای postID خودم یک ای دی بدم؟
۲٫ در یک صفحه چند جا ستاره های امتیاز دهی را بزارم و با هم تداخل نداشته و از هم جدا باشند؟
۳٫ این سورس را چطور در قالب سایتم بگنجانم که بصورت شورت کد یا افزونه یا … بشینه ؟

پاسخ

حسن شفیعی ۱۲ آذر ۱۳۹۷

سلام.خوشحالم که مفید واقع شده.
تمام اینها موارد ساده ای هستند و فقط نیاز است که php مقدماتی به بالا را بلد باشید که بتونید این تغییرات رو لحاظ کنید.

کتاب آموزش php برای شما مفید هستش.

موفق باشید.

پاسخ

وحید ۲۱ خرداد ۱۳۹۷

data: ‘postID=’+attrVal+’&ratingPoints=’+val,
این خط تو قشمت ایجکس مشکل داره و ارسال به درستی انجام نمیشه و اطلاعات و نمی تونه به دیتا بیس بفرسته

پاسخ

حسن شفیعی ۲۱ خرداد ۱۳۹۷

ممنونم از توجهتون . سورس کامل پروژه اضافه شد .

پاسخ

وحید ۲۱ خرداد ۱۳۹۷

این آموزش ناقصه
این فایل رو نداره
widget_star.gif
لطفا بزارید تا مام استفاده کنیم

پاسخ

حسن شفیعی ۲۱ خرداد ۱۳۹۷

سلام. دوست عزیز فایل ناقص نیست فقط تصویر ستاره رو باید به فولدر اضافه کنید که به فایل اصلی اضافه شد و میتونید مجددا از طریق باکس دانلود دریافت کنید.

موفق باشید.

پاسخ

محمد ر ۱۰ بهمن ۱۳۹۶

عضویت توی سایت خییییییییییییییییلی سخته
بخاطر سست بودن رمز عبور کلی ازیت کرد !!!

پاسخ

حسن شفیعی ۱۰ بهمن ۱۳۹۶

شرمنده بابت این موضوع . سخت گیری برای پسورد بیشتر برای امنیت حساب کاربری شما جهت حفظ خرید ها و لینک های دانلود شما کاربران عزیز هستش.

درجه سختی قسمت انتخاب پسورد اصلاح و برای استفاده بهینه تر شد.

موفق و پیروز باشید

پاسخ

الناز ۱۳ دی ۱۳۹۶

سلام وقتی تو گوگل یه چیزی رو سرچ میکنیم سایت شما رو میاره پایینش امتیازرو نشون میده ایا این فایلم این قابلیت رو داره؟؟
یه سوال دیگه شماهم این قابلیت رو گذاشتید ولی تو صفحتون این قسمت وجودنداره که ما امتیاز بدیم.

پاسخ

حسن شفیعی ۱۳ دی ۱۳۹۶

سلام.
این موردی که گفتید rich snippets است که باید با استفاده از کد نویسی به سایت خودتون اضافه کنید که تگ های لازم برای این کار را خود گوگل در بخش developers معرفی کرده .(لینک)
بله این قابلیت همان لایک ها و دیس لایک هایی است که در انتهای هر پست به صورت (قلب) قرار داره شده و بصورت درصدی در پشت صحنه تعیین میشه .
موفق و پیروز باشید

پاسخ

مهدیار ۱۱ آذر ۱۳۹۶

سلام
لینک فایل های js و css خرابه…
لطفا بررسی کنید
ممنونم

پاسخ

حسن شفیعی ۱۱ آذر ۱۳۹۶

سلام . لینک مشکلی نداره فقط به خاطر تغییراتی که دادیم به طور معمول قایل دانلود نبود که اصلاح شد.
لینک داخل باکس دانلود قرار داده شد میتونید استفاده کنید

موفق باشید

پاسخ

امتیاز دهی ستاره ای در PHP

ساخت جداول دیتابیس :

فایل rating.js و rating.css :

فایل dbConfig.php :

فایل index.php :

فایل rating.php :

دانـلود باکــس

آموزش کامل ساخت دیتابیس MySQL در PHPMyAdmin

ساخت لیست todo با php

ساخت امتیازدهی ستاره ای با PHP و Ajax

امتیازدهی ایموجی با php و ajax

لغو پاسخ

دوره آموزش ساخت دیجی کالا با php به همراه اپلیکیشن اندروید

آموزش ساخت ربات تلگرام با PHP (از پایه و پروژه محور)

دوره جامع آموزش طراحی سایت + پروژه قالب فروشگاه