Hi all,

I'm trying to make a simple voting system for images. The user uploads an image then all the images are displayed and people can vote on it.

I got the image upload and display part working, but I can't get the voting system to work.

I found this tutorial here http://www.designscripting.com/2012/...g-jquery-ajax/, but I can't get it to work with multiple images on the page.

All votes go to the first image.

The JS on the tutrial has this

Code:
$(document).ready(function()
	{
		$(".submitVote a").click(function()
		{
			var ID = <?php echo $id;?>//$("#vote").text();
			var rating = <?php echo $ratings;?> 

			var queryString = 'id='+ ID +'&vote='+rating;
			$("#vote").text(rating+1); 

				$.ajax({
				type: "POST",
				url: "submitVote.php",
				data: queryString,
				cache: false,
				success: function(html)
				{

					$(".submitVote").html('<p style="margin:1px;padding:0px;">Submit your vote</p>');
					$("#greet").html("Thanks for voting!");
					$("#greet").delay(500).fadeOut(2000);

				}
				});

		});

	});
I tired changing the ID var to
Code:
var ID = $(this).attr("id");
and gave the images a dynamic id, but that really messed things up. It's started adding multiple votes to the database.

I'm not sure if it's a JavaScript or a PHP issue, but I think it's JavaScript.

Here's my full code

index.php

Code:
<?php 
include('db-connect.php'); 
$sql = "SELECT * FROM entries";
$result = mysql_query($sql) or die(mysql_error());
$row = mysql_fetch_array( $result );
$id = $row['id'];
$ratings = $row["rating"];
?>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
	$(document).ready(function(){

		$(".submitVote a").click(function(){
			var ID = $(this).attr("id");
			var rating = <?php echo $ratings;?>; 

			var queryString = 'id='+ ID +'&vote='+rating;
			$("#vote").text(rating+1); 

				$.ajax({
				type: "POST",
				url: "submitVote.php",
				data: queryString,
				cache: false,
				success: function(html){

					$(".submitVote").html('<p style="margin:1px;padding:0px;">Submit your vote</p>');
					$("#greet").html("Thanks for voting!");
					$("#greet").delay(500).fadeOut(2000);

				}
				});

		});

	});
</script>
display-entries.php
PHP Code:
include('db-connect.php');
$result = mysql_query("SELECT * FROM entries") or die(mysql_error()); 
echo '<table class="entry-table"><tr>';    
$count = 0; 
while ($row = mysql_fetch_array( $result )){   
    $entry_name = $row['entry_name'];   
    $entry_submition = $row['entry_filename'];   
    $entry_description = $row['entry_description']; 
    $entry_pic = '<div class="display-img"><a href="../photos/'.$row['entry_filename'].'" rel="prettyPhoto"><img src="../photos/'.$row['entry_filename'].'"></a></div>';
    $entry_approved = $row['approved'];
    $id = $row['id'];
    $ratings = $row["rating"];
    if($entry_approved == 1){
    ob_start();?>
        <td>
        <div class="contest-entry">
            <div class="inner">
                <?php echo $entry_pic; ?>
                <div class="entry-name">
                    <p><strong>Submitted By:</strong> <?php echo $entry_name; ?></p>
                </div>
                <div class="entry-description">
                    <p><strong>Desctiption:</strong> <?php echo $entry_description; ?></p>
                </div>
                <div class="vote-container">
                    <span class="submitVote" >
                            <a href="#" id="<?php echo $id; ?>">VOTE</a>
                    </span>
                    <div id="voteBox">
                        <div id="vote"><strong><?php echo $ratings;?> Votes</strong></div>
                    </div>
                    <div id="greet"></div>
                </div>
              </div>
        </div>
        </td>
    <?php echo ob_get_clean();
    if ( ++$count % 4 == 0 ) { 
        echo '</tr><tr>'; 
    } 
    }
}  
echo '</tr></table>';

submitVote.php
PHP Code:
include('db-connect.php');
if($_POST['id']){
    $id=mysql_escape_String($_POST['id']);
    $rating=mysql_escape_String($_POST['vote']);
    $rating= $rating+1;
    $sql = mysql_query("UPDATE entries SET rating={$rating} WHERE id={$id}");
    $submitted = mysql_query( $sql, $db_connect );
        if(! $submitted ) {
            if($test_connection == true){
                die("Cannot submit data " . mysql_error());
            } else {
                die('Could not enter data: ' . mysql_error());
            }
        }
} 
If any one can help me, Thanks in advanced.