1

I'm currently working on a website with different sections which looks like this:

enter image description here

Every Section has an image which you can like / dislike - something similar to facebook

What I want to have is, if someone press on like / dislike button, the like counter value in my database should be increased by 1. But, that's not the problem, i know how to to that...

My Problem:

How can I give that section with the image an unique ID (I thought I can get the ID of the image from the Database and add this value to a hidden field in my section). Next i bind an onclick to both buttons (like / dislike) and read the value of my hidden field (the ID) in the section. With this ID i can increase my vote counter with a DB query - which look then something like this:

UPDATE xxx SET upvotes = upvotes + 1 WHERE ID = $valueOfTheHiddenField

same on dislike

UPDATE xxx SET downvotes = downvotes + 1 WHERE ID = $valueOfTheHiddenField

I don't know if that's the correct method to do this, but that were my ideas on how to do that.

Please correct me if I'm wrong or tell me the "best" way how to solve this.

thanks for your inputs :)

thor
  • 21,418
  • 31
  • 87
  • 173

3 Answers3

1

You can change the IDs of HTML elements with jQuery:

Changing an element's ID with jQuery

You can also use HTML5 data attributes:

https://developer.mozilla.org/de/docs/Web/Guide/HTML/Using_data_attributes

But maybe it makes more sense to set these IDs / data attributes server-side with PHP.

Community
  • 1
  • 1
RhinoDevel
  • 712
  • 1
  • 12
  • 25
1

It's a good way to do this, you'll probably use Javascript for what you want to do. Here is how you can create you Like/Dislike button:

<a href="#" data-id="THE_ID" data-action="like" class="actionButton">Like</a>
<a href="#" data-id="THE_ID" data-action="dislike" class="actionButton">Dislike</a>

And on the Javascript side:

$(".actionButton").click(function(){
  var image_id = $(this).attr( "data-id");
  var action = $(this).attr( "data-action");

  // Send your data via AJAX :)

});
Akram Fares
  • 1,653
  • 2
  • 17
  • 32
0

I'd agree that what you've got there is the basis for something workable but Could i suggest an element of randomization in the way you give your images id's.

There are several benefits to obscuring the id of the image including

  • Making it harder to vote skew
  • Making it harder to auto voters to crawl between images
  • Hiding information that is not needed for the end user through another method that contains a similar amount of entropy.

You could create the image from the file name + a random number + the current time or something similar, this will make it reasonably hard to work out which images were uploaded before others.

You might also want to take into account things such as

  • Logging votes to stop vote tumbling (Where users can cast multiple votes quickly).
  • Ensure your system to work out whats popular is fair.

Hope this helps a little, I've done something similar before!

Duenna
  • 2,186
  • 2
  • 14
  • 17