طراحی سایت, ساخت ربات تلگرام, آموزش php , سورس کد php ,سورس ربات تلگرام , سورس فروشگاه اینترنتی , آموزش طراحی وب

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


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

امتیازدهی ایموجی (emoji) همانند فیسبوک یکی از قابلیت های موردعلاقه من است که در صفحه وب بسیار جالب است. مخصوصا برای جمع کردن حالات (emotion) کاربران زمانی که یک امتیاز یا لایک را اضافه می کنند.

در این آموزش php , قصد داریم یک حالت از شبیه سازی این قابلیت امتیازدهی ایموجی با php و ajax را پیاده سازی کنیم.

در این مثال, یک لیست رکوردها را از دیتابیس نمایش می دهیم. هر رکورد شامل یک گزینه برای اضافه کردن لایک توسط کاربر است. با بردن ماوس روی گزینه like آیکون های ایموجی برای افزودن حالات یا همان احساسات کاربر ظاهر می شود.

در آموزش قبلی نحوه ساخت امتیازدهی ۵ ستاره توسط php را دیدیم. اگر آموزش قبلی را خواندید پس پیاده سازی این مثال برای شما آسانتر خواهد بود.

 

گزینه های افزودن یا ویرایش لایک های کاربر با ajax انجام می شود. با کلیک روی آیکون ها, داده های آیکون به سمت کد php برای آپدیت دیتابیس ارسال می شود.

تعداد لایک ها و حالات یکتا در دیتابیس ذخیره و در هر سطر نمایش داده می شوند. بعد از عملیات add/update توسط ajax صفحه بدون رفرش شدن آپدیت می شود.

 

صفحه HTML برای نمایش داینامیک امتیازدهی ایموجی

در مثال امتیازدهی ایموجی با php و ajax از داده های جدول tbl_tutorial بری نمایش داینامیک صفحه استفاده کردیم. این جدول شامل ۳ رکورد به همراه نام و توضیحات هر سطر است. برای هر سطر, یک گزینه like نمایش داده می شود.

با هاور (hover) روی این گزینه ها, آیکون های ایموجی نمایش داده می شود. با کلیک روی آیکون دلخواه, داده مورد نظر به سمت php با ajax ارسال می شود.

برای کپی صحیح و کامل کدها ، دابل کلیک کرده تا وارد محیط سفید و کپی شوید در غیر اینصورت امکان دارد اجرای کدها با مشکل روبرو شود

نمایش ایموجی ها و add/update امتیاز توسط ajax

این اسکریپت به شما توابع jQuery ساخته شده برای نمایش/مخفی کردن آیکون ها با حرکت ماوس روی المنت likeرا نشان می دهد.همچنین شامل توابع انجام عملیات افزودن/بروزرسانی امتیازدهی ایموجی با ajax هستند.

توابع showEmojiPanel و hideEmojiPanel با رویداد mouse-over و mouse-out فراخوانی می شوند.

با کلیک روی آیکون های ایموجی, تابع addUpdateRating() اجرا می شود. این تابع, درخواست ajax را به سمت PHP ارسال می کند.

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

در این مثال تعداد لایک ها و آیکون ایموجی را در فرمت HTML نمایش می دهد.

کد PHP برای پردازش عملیات امتیازدهی ایموجی

در این اسکریپت PHP , درخواست ajax توسط پارمترهای tutorial_id و emoji_rating دریافت می شود.اینجا فایل Rate.php برای برای خواندن و آپدیت امتیاز ها در دیتابیس include می کنیم.

حتما بخوانید  افزودن ایموجی به سیستم نظرات توسط PHP

در این کد, تابع getRartingByTutorialForMember نتایج دیتابیس برای برای چک کردن اینکه آیا کاربر قبلا برای این آموزش لایکی را ثبت کرده است یا خیر, بررسی می کند اگر خیر, یک رکورد جدید به جدول tbl_member_rating با تابع addRating اضافه می شود.

اگر از قبل موردی توسط این کاربر برای این رکورد در دیتابیس وجود داشت, پس سطر موردنظر بروزرسانی می شود.

بعد از انجام عملیات افزودن و بروزرسانی امتیازها, داده های در فرمت HTML به سمت AJAX برای بروزرسانی UI برگشت داده می شوند.

کلاس PHP برای دسترسی و بروزرسانی دیتابیس

ما دو کلاس برای دسترسی و انجام عملیات insert یا update برای امتیازدهی ایموجی با php ایجاد کردیم.

کلاس Rate.php شامل توابع ساخت کویری دیتابیس و فرم نوع پارامترهای کویری و آرایه مقادیر است. کلاس DBController.php هم وظیفه اتصال به دیتابیس و ساخت کویری های مرتبط به دیتابیس را دارد.

Rate.php

این فایل شامل توابع دریافت همه رکوردهای دیتابیس به همراه داده های امتیازدهی است. از تابع getAllPosts برای join زدن داده های بخش tutorial و rating استفاده کردیم. تابع group_concat نیز برای دریافت دسته جمعی امتیازها از دیتابیس استفاده شده است.

همچنین توابع addRating.php و updateDating.php داده های دریافتی را در فرمت آرایه ای می چینند. این آرایه برای bind کردن در کویری دیتابیس کلاس DBController استفاده می شود.

DBController.php

اسکریپت دیتابیس

کد SQL زیر برای ساخت جداول و قرار دادن داده های مورد نیاز امتیازدهی ایموجی با php و ajax در جدول دیتابیس استفاده شده است.

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

اسکرین شات زیر به شما خروجی مثال شبیه سازی امتیازدهی ایموجی با php و ajax همانند فیسبوک را نشان می دهد.

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

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

برای دانلود سورس کد از باکس دانلود زیر استفاده کنید.

هر سوالی داشتید ، از قسمت نظرات ارسال کنید . سریعا ، پاسخگوی سوالات شما هستیم .

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

اگر مفید بود, لطفا به اشترک بگذارید تا دوستان دیگر نیز بهره ببرند

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

دیدگاه کاربران

2 پاسخ به “امتیازدهی ایموجی با php و ajax”

  1. نوید فلاح گفت:

    دست مریزاد واقعا بهترین سایتی هستین که تا حالا دیدم

    0

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

دانلود رایگان (هدیه ویژه)

کتاب آموزش زبان برنامه نویسی PHP را دانلود و همین امروز یادگیری را شروع کن و به جمع برنامه نویسان ملحق شو ;)

دانلود رایگان کتاب

آموزش طراحی وب سایت

نظر کاربران عزیز

آموزش های آنلاین در چه زمینه ای تهیه کنیم ؟

  • آموزش جاوااسکریپت و جی کوئری (45%, 10)
  • آموزش ساخت ربات تلگرام (45%, 10)
  • آموزش بوت استرپ 4 (9%, 2)

تعداد رای ها : 22

Loading ... Loading ...

بخش کاربران

هنوز عضو نیستید ؟ کلیک کنید

مجوزهای ما


logo-samandehi نماد اعتماد الکترونیک

دانلود کتاب

عضویت در خبرنامه