使用循环内的Jquery检索HTMl元素的PHP变量值

Question

I have a strange problem. I am getting the table values using PHP MySQL using a while loop and stored them in a array. Then I am displaying it one after another in a single page.

    $sql = "select * from newsfeed order by id DESC";
$result = $db->query($sql);

$posts_array = array();  // Storing the result to an Custom Array
$index = 0;

if($result->num_rows > 0)
{
    while($row = $result->fetch_assoc()) {

        $posts_array[$index] = $row;
        $index++; 
    }
}

I have successfully set the $post_id of the posts on to the HTML elements using the following code.

    <?php 
                $array_size = sizeof($posts_array);
                for($i = 0; $i < $array_size; $i++){
            ?>
            <div class='wrapper' id='wrapper'>
            <div class='user'>
<!-- Some Code -->
                <?php
                    $post_id = $posts_array[$i][id];
                 ?>
             <input type='image' name='like' id='like' width='40' height='40' src='like_btn.png' value='<?php echo ($post_id);'?> />

            <?php } ?>

Now I want to take that value using Jquery and do some Database Work. I have accessed the value using the following code:

    <script type="text/javascript">
    function justsomething() {
        alert($(this).val());
    }
</script>

The problem is I am only getting the last post's id as alert() for every post rather than getting different id's . Please help me. I am confused whether the PHP script is loading every time I click and call the justsomething() function.

Note: I can display the $post_id of every post alone without any problem.

Answer 1

Beacuse the id should be unique to one html element try changing your code to this :

<?php $array_size = sizeof($posts_array); for($i = 0; $i < $array_size; $i++){ ?>
<input type='image' name='like_<?php echo $i ?>' id='like_<?php echo $i ?>' width='40' height='40' src='like_btn.png' value='<?php echo $post_id;?>' onclick='justsomething(this);' />
<?php } ?>
<script>
function justsomething(el) {
    var img = el;
    alert(img.value);
}
</script>

here is an example

function justsomething(el) {
    var img = el;
    alert(img.value);
   }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type='image' name='like_1' id='like_1' width='40' height='40' src='like_btn.png' value='15454' onclick='justsomething(this);' />

</div>