CODEWITHSUNDEEP
phpjavascriptmysqlvariables
mayank23
mayank23

Reputation: 1

Passing values from PHP to JavaScript

I'm trying to get the value which is the id in the mysql database. However, each time I click on the image, I get null. I used this to get the value but it is not working as it keeps giving me null in the alert box. 

<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>
    <?php
        mysql_connect('localhost','root','');
        mysql_select_db("ajax");
        $query="SELECT * FROM xxxx";
        $result= mysql_query($query);

        while($row=  mysql_fetch_array($result)){
            echo "<img src='".$row['filepath']."' value='".$row['ID']."' id='".$row['ID']."'   onclick='getrating(this.value);'>";

            echo "<br>";
       }
    ?>

    <script type="text/javascript" >
        function getrating(row_id){
            var x = document.getElementById(row_id);
            alert(x);
        }
    </script>  
</body>
</html>

What is the problem?

Upvotes: 0

Views: 1329

Answers (6)

Mollo
Mollo

Reputation: 723

They way how you escape the ID could be the problem. I know this is already answered but just in case for those people who needs another solution.

onclick="getrating(\''.$row['ID'].'\')"

Upvotes: 0

Minko Gechev
Minko Gechev

Reputation: 25682

Try this:

 echo "<img src='".$row['filepath']."' id='".$row['ID']."' onclick='getrating(".$row['ID'].");'>";

Upvotes: 2

vascowhite
vascowhite

Reputation: 18440

An <img> doesn't have a value property.

You are doing unnecessary work in your function too. Your code should look like this:-

<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>
    <?php
        mysql_connect('localhost','root','');
        mysql_select_db("ajax");
        $query="SELECT * FROM xxxx";
        $result= mysql_query($query);

        while($row=  mysql_fetch_array($result)){
            echo "<img src='".$row['filepath']."' value='".$row['ID']."' id='".$row['ID']."'   onclick='getrating(this);'>";

            echo "<br>";
       }
    ?>

    <script type="text/javascript" >
        function getrating(element){
            alert(element);
        }
    </script>  
</body>
</html>

By passing this to your function through the onclick event, you already have the element you are looking for without needing to use document.getElementById().

Upvotes: 0

Diode
Diode

Reputation: 25135

Or you can pass this.id

<img id="row_12" onclick="getrating(this.id)" alt="image"/>



function getrating(id){
    alert(id);
}

Or you can use the event object and the currentTarget propety

<img id="row_12" onclick="getrating(event)" alt="image"/>



function getrating(e){
    alert(e.currentTarget.id);
}

Upvotes: 1

Ry-
Ry-

Reputation: 224845

You need getrating(this.id) instead. Images don't have a value property.

Upvotes: 4

Daren Chandisingh
Daren Chandisingh

Reputation: 2165

value isn't a valid attribute of the img tag. You could use the id, or just do

echo "<img ... onclick='getrating($row[ID]);'>";

Upvotes: 0

Related Questions