i need help to pass mysql/php variable to javascript? - php

Question

im trying to get the id of the picture the user selected to rate with the onclick,however it will only alert "null". when the user selected the div tag, it will alert the id. i want to display the id. i can build off of this and then implement ajax to rate the picture. But, i need help on getting the id of the picture the user selected.
<?php
mysql_connect('localhost','root','');
mysql_select_db("ajax");
$query="SELECT * FROM xxxx";
$result= mysql_query($query);
while($row= mysql_fetch_array($result)){
$rating=$row['ID'];
echo "<img src='".$row['filepath']."'>";
echo "<br>";
echo "<div id='".$row['ID']."' value='".$row['ID']."' onclick='getrating();'>Likes: ".$row['Likes']."</div>";
echo "<br>";
}
im trying to get what picture the user selected to rate.
?>
<script type="text/javascript" >
function getrating(){
var x= document.getElementById("<?php echo $row['ID']; ?>");
alert(x)
}
</script>

Answer 1

A few things that you should do:
Try giving an id which starts with a letter for example, when writing the HTML code use:
echo "<div id='img" . $row[ 'ID' ] . "'></div>"
Note that i've added a prefix 'img' to the div's ID.
You have to pass the correct index to the javascript function because you are drawing the divs in a list but not the javascript function:
onclick='getrating( " . $row[ 'ID' ] . " );'
Now the javascript function will get the correct image ID when called upon clicking the respective DIV element.
Change the javascript function to:
<script type="text/javascript" >
function getrating( id )
{
var x = document.getElementById( "img" + id );
alert( x );
}
</script>

Answer 2

onclick="getrating(this.value);"
That code will pass the current value attribute of the div to the function you made in JavaScript. Be sure to add a parameter to your function to receive the data.

Answer 3

Easy.
Change this:
echo "<div id='".$row['ID']."' value='".$row['ID']."' onclick='getrating();'>Likes: ".$row['Likes']."</div>";
to this:
echo "<div id='".$row['ID']."' value='".$row['ID']."' onclick='getrating(this.value);'>Likes: ".$row['Likes']."</div>";
And this:
function getrating(){
var x= document.getElementById("<?php echo $row['ID']; ?>");
to this:
function getrating(row_id){
var x= document.getElementById(row_id);

Answer 4

You should put your event handler inside image like this:
<img src="" onclick="getrating(this.value)">
And you function should be like this:
function getrating(row_id){
x = document.getElementById(row_id);
alert(x);
}