How To Implement The Dislike-like Button

I am developing a web page with rating mechanism, so I need two buttons called 'dislike' and 'like', once clicked, the rating information would be sent to the server to update the

Solution 1:

erm... you can't really do that with html alone, mate. You need a server-side script to handle that. Suggest Php.

After that, use a GET or POST method to carry your like or dislike vote to the server-side script.

Solution 2:

I am leaving this answer in case if someone else faces this problem in future :

As said by Kaleb , this functionality can not be achieved by html itself, database is must for this because once you close the html page your upvote and downvote counter will be gone.

What you need to do is :

1. In your database , make a table say "votes" .

2. This table should have following columns

   • voteup - this should be filled with two options either yes or no
   • votedown - this should also be filled with two values "yes" or "no"
   • voteup_count -This will count the total of upvotes
   • vote_down - This will count the total of downvotes

   Working

   • Before rendering your html page , check the corresponding entries into database whether the particular post is already upvoted or downvoted
   • If the post is upvoted and you again click the upvoted button the button text should change from upvoted to upvote and the counter should be decremented by 1 in the database as well under the voteup_count column

   • If the post is neither upvoted nor downvoted whenever the button is clicked it should increment the respective counter and then again change the button text either to upvoted or downvoted

   • of course your like and dislike button should also be dynamically created for each form.

Solution 3:

<form name="ratings">
    <input type="button" name="btnLike" value="Like">
    <input type="button" name="btnDislike" value="Dislike">
</form>

Then whatever code you use to check the answer should accept the value of the button as a parameter for the update.

Solution 4:

You should use a form. Here is an example I've copied from the Internet.

<form action="mulsub.asp" method="post">
First name: <input type="text" name="fname"><br/>
<input type="submit" name="bsubmit" value="Submit 1">

<input type="submit" name="bsubmit" value="Submit 2"> <input type="submit" name="bsubmit" value="Submit 3"> </form> Check it out on this webpage. Programmed in ASP, I hate that language by the way :)

Solution 5:

Try this:

<span class="likebtn-wrapper" data-identifier="likeButton1" datatheme="ugreen"></span><script>(function(d,e,s){if(d.getElementById("likebtn_wjs"))return;a=d.createElement(e);m=d.getElementsByTagName(e)[0];a.async=1;a.id="likebtn_wjs";a.src=s;m.parentNode.insertBefore(a, m)})(document,"script","//w.likebtn.com/js/w/widget.js");</script>