Question

I want to put Thumbs up/Thumbs down buttons on my website.
There will be quite a few of them displayed at once, so I don’t want to have to do a POST and reload the page every time the user clicks on one.
I thought of using re-skinned radio buttons to choose Thumbs up/Thumbs down, but that would require the user to click a submit button.
So how do I do this? I am open to using JavaScript or some other form of Client-Side scripting, so long as it is built in to most/all web browsers.
Thanks!
YM

Answer 1

You’re definitely going to need to use JavaScript on this. Well, there are other client-side languages that could technically do the job (ActionScript, for example), but JavaScript is definitely the best way to go.

Look into AJAX (Asynchronous JavaScript And XML). This is just a buzzwordy way of saying use the XMLHttpRequest() object to make page requests with JavaScript without reloading the page. Here’s a good tutorial: http://www.w3schools.com/ajax/default.asp . Note that, despite the word “XML” being in the title, you don’t have to use XML at all, and in many cases you won’t.

What you’ll basically do is this:

1. Have your thumbs-up and thumbs-down buttons linked to a JavaScript function (passing in whether it’s a like or dislike via a function argument).

2. In that function, send a request to another page you create (a PHP script) which records the like/dislike. Optionally, you can have the PHP script echo out the new vote totals.

3. (optional) If you decided to have your PHP script output the new results, you can read that into JavaScript. You’ll get the exact text of the PHP script’s page output, so plan ahead according to that — you can have the PHP script output the new vote totals in a user-friendly way and then just have your JavaScript replace a particular div with that output, for example.