JavaScript: Changing the onclick value of a link

JavaScript
1

How do I use JavaScript to change the onclick value of a link?

Example link:
<a id=“voteup” href=“#” onclick=“vote(0,1);”>Vote Up</a>

Inside the function that’s supposed to change the value, I’ve been trying to use something like:
document.getElementById(“voteup”).onclick = “vote(”+itemID+“,1);”;

Needless to say, it’s not working.

It works fine to change the href value though…
e.g.: document.getElementById(“voteup”).href = “vote.php?id=”+itemID+“&vote=1”;

2

Hi,

Could you give us a brief example of what you are trying to do (obviously something to do with upvotes) and provide a minimum amount of code that we can run to recreate your issue?

3

You shouldn’t be using code like that at all.

  1. You need to replace the # with where you want the link to go for people who don’t have JavaScript enabled.

  2. Get rid of the onclick event handler in the HTML and replace it with a click eventlistener in the separate JavaScript file. You can then attach whatever processing you like to the click and replace or remove actions as required.

4

I’m not all that fluent with JavaScript, so I’m not sure how to create the event listener, but I’ll look into it.

I was trying to keep it simple, but I can provide more code…

<div id="title" style="text-align:center; font-weight:bold;">---</div>
<br />
<div id="vote" style="text-align:center;">
<a id="voteup" href="#" onclick="submitVote(0,1);">[Vote Up]</a> | <a id="votedown" href="#" onclick="submitVote(0,0);">[Vote Down]</a>
</div>

<script type="text/javascript">
jwplayer().onPlaylistItem( function(event){
    document.getElementById("voteup").onclick = 'submitVote('+jwplayer().getPlaylistItem().mediaid+',1);';
	document.getElementById("votedown").onclick = 'submitVote('+jwplayer().getPlaylistItem().mediaid+',0);';
	document.getElementById("title").innerHTML = jwplayer().getPlaylistItem().title;
return;
});
  </script>

I’m trying to use AJAX so that the page doesn’t reload when somebody votes on the video currently playing from the playlist.
I didn’t include the AJAX code, but basically the function submitVote() sends a request to a PHP vote script.
The function uses two integer variables, the first one is the ID of the video, which should be updated in the vote links upon each video to match the ID of the current video. The second is just the vote (0 for vote down; 1 for vote up).
Before I started on the AJAX, the links pointed directly to the vote script, and there was no problem getting the variables in the href to change upon each video.
The title still changes just fine.

5

Hi,

So to summarize your problem:

You some videos that people can vote on, these are identified by their id.
You have two links per video, one for “Vote up” and one for “Vote down”.
You also have a list of the videos with a tally of up-votes and down-votes.
When someone hits either the “Vote up” or the “Vote down” link on any of the videos, you want to submit an AJAX request to a PHP script which will then update the tally of up-votes and down-votes (presumably in a database).
Once the AJAX request has completed, you want to update the tally of up-votes and down-votes for the respective videos on your page.

Did I get that right?

6

Yeah, that’s pretty much the gist of it. I’m just having trouble getting JavaScript to update the onclick values of the vote links.
But as felgall basically suggested… maybe I’m going about this all wrong. =/

7

Why do you need to do this?
This isn’t how AJAX works.

Well, I can help you with that, but it’s important that we understand what you are trying to do first.

Would it help if I made a simple example page doing what I suggested above?

If so, do you mind using the jQuery library to implement the AJAX functionality?