Ajax CSS jQuery PHP

Youtube like rating script jquery php

   In this Youtube like rating script jquery php tutorial we will create youtube like video rating script using jquery and php. Actually there is no use of php apart from saving the rating choice, (thats not less) but main role has been played by the jquery and css.   Lets start with html, and dont forget to enable quirks mode, which will trigger strict mode in almost all browsers. This script now only supports firefox and google chrome. In all IE version its not working, I am not sure but i thing its PNG issue, there are few solution for fixing PNG issue, I dont want to waste time on it. I didnt tried to make it work in IE, I have left that on you 🙂

I didnt implemented ip / user based rating so one user can either like it or dislike it. Here you can click like or dislike any number of times. You can make it so with few if else statements.

This is how our script will look like

Youtube like rating script

Youtube rating script

Youtube rating script

Lets style it with css
here’s the heart of script
ajax_server.php to store and fetch record
Simple database table structure
View Demo  Download

View Demo (Rate Once)  Download (Rate Once)

50 Comments

    • Rajandran, I am little bz now a days so cant make this changes right now…but there will be next version with this feature for sure, may be in this week on;y.

      • Yes, I can make that comment script, but if its urgent one then it wont be possible, its hard for me to find some free time.

  • Does it still works with the new YouTube’s interface?
    And how to install it with Greasemonkey/Tampermonkey?
    I’m deeply apologize if this kind of question is not allowed or you already guided how, but I can’t find it anywhere.

    • @Acellutor : This is not greasemonkey script…its standalone script that u can use as it is in your application.

  • Hi, It doesn’t seem to work? I have created a new table etc but when i click on thumbs up, it says Loading…. and that’s it. Any ideas?

    • you need to set database login credentials, open config.php and change db_login and db_pass values. It should work.

  • Hi Amit,
    thanks a lot for the distribution of your work!! I got same problem as andy – loading… thats it. the connection to the table is set though as my database updates whenever I rate. Do you have anything in mind by chance?

  • Amit, great script, I noticed on the ip version there is a hidden field for an id. All well and good for what I am trying to use this for. BUT my issue is with having this on the same page. If there is examples: 1, 2, and 3. And I click on like on example 1, the 2 and 3 boxes show up as well. Is there a way to make it so each one is distinct and still work? Please do let me know as I am trying to integrate this into a project today.
    Thanks so much!

    • It can be converted in anything….because there are no third party contents apart from javascript, css, & html.

  • Hey Amit!

    I’ve been searching for something exactly like this for WordPress (Like/Dislike, limited by unique IP). And here it is, but it’s not for WordPress, though. I was just wondering if you could help me convert this into a plugin where this would be added below each post.

    I could try to do it myself, but I’m not confident enough that I could accurately convert your MySQL comments into WordPress’s $wpdb ones (http://codex.wordpress.org/Class_Reference/wpdb), nor am I entirely sure where to put the contents of ajax_server.php (in functions.php in theme or place the file in the theme root by itself?). I guess the like button could then be appended after the_content (after each post) like this: http://pastebin.com/LQ0VRy0x

    Is this script fine for security, especially if it was used with WordPress. I don’t want to get hacked using it.

    Your help would be immensely appreciated!

    Thanks,
    Mike

    • I am sorry to say but i am not in to wordpress plugin development, otherwise u would have seen lot of wp plugin on my blog 😛
      I cant suggest u where the files and plugins should be 🙁

  • Amit, thanks for all your help. My issue is with having two on the same page too. Could you email me the updated code? And can I integrate my users?

  • hi there Amit, nice script, I have the sam problem with “Loading…” i don’t know how to solve it…
    I don’t know gow config.php works…

  • hello Amit. I want the code for multiple item liking. I saw that you sent a script for this problem to other user that posted the question ” If there is examples: 1, 2, and 3. And I click on like on example 1, the 2 and 3 boxes show up as well. Is there a way to make it so each one is distinct and still work?”.
    I want this the script too.
    Thanks a lot.

  • Hi Amit,

    I have modified your value from “34” to <input type="hidden" id="item" value="”>
    I am storing a alpha numeric value in item-id using which is related to each video
    the sql insert is working fine as i click like and dislike, but the ajax to display is total likes and dislikes is stuck at loading

    can you please help?
    Abi

    • Its not possible, though programming we cant like a video, it needs valid user account to like a video.

  • cool script , easy to install and to use i was waiting for the (Rate Once) version and its really cool 🙂
    BUT :
    after liking or disliking it shows warning msg says You have already rated this item !
    and the rating bars and percentage disappear 😐 LOL
    suppose i want to see where the rating reached ( rating results like/dislike ) what do i do ? change my ip and delete cookies ? LOL
    am i missing something here ?

    • If you want to see the rating, you need to fetch it from the database, voting count has been stored in the database to display wherever you want.

  • Hi Amit,

    Thank you for your great script. I have copied every thing and also created the db but its not working. It is saying undifined for both like and dislike and doesn’t count votes at all. I would appreciate if you could help me.

    Thank you

  • Hi,
    Sorry for the mistakes, I’m French.
    Thank you for this script. I solved the multiple item but I do not have the message “You have already voted”

    Thank you

  • My script has 40 different records from one database, is it possible to create 40 different like/dislike records too which work seperatly from each other?

  • You Script is great i was looking for something like that. i have integrated your script as a e107 CMS plugin. I realy appriciate your work and looking forward for any new stuff you will write. Good job and Thanks.

  • Hi
    I am running your script on xammp localhost with hostname=”localhost” username=”root”, pass=” ” and database=”ytube” but not working. On clicking any of two buttons shows loading…. Please help me.

  • There are some fairly serious security holes in this script, in particular SQL injection. The $item variable can be used to perform the update against all rows instead of just the one you intend.

    To fix it, mysql_real_escape_string() would be a good start, but the mysql_ library is deprecated now anyway. I suggest you move to PDO or mysqli.

Leave a Comment

*

Notify me of followup comments via e-mail. You can also subscribe without commenting.

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Shares

Let your friends know what are you reading

Share this post with your friends!