通过$ post在jquery中发布隐藏的输入值

Question

I have problem, have a look at my code:

Html + php:

<?php foreach($result as $row) { ?>
<div class="col-md-3">
<input type="hidden" name="albumid" value="<?php echo $row['id']; ?>">
<a href="#?albumid=<?php echo $row['album_id']; ?>" class="thumbnail"id="this1">
        <img src="images/<?php echo $row['album_thumbnail']; ?>.jpg" alt="Pulpit Rock" style="width:245px;height:200px;">
        <p align="center" style="margin:0px;"><?php echo $row['album_description']; ?></p>
    </a>
    </div>
  <?php } ?

Note that this $result is from sql, pdo query Jquery:

$(document).ready(function(){
$('a#this1').click(function(){
    $("div.albums").hide();
    $("div.pics").show();
    var albumid = $("input[name=albumid]").val();
          $.post( "gallery-pics-temp.php",{ name: "Zara", albumid: albumid },function(data){ 
          $('p#myid').text(data);
          });
});
});

when i click on link (with id "this1"), then var albumid in jquery has always same value, although through foreach every loop/row has different albumid, but only value of first albumid goes in 'gallery-pics-temp.php'. Note that foreach loop work correctly and there are different values but the problem is only with jquery,i.e it send same values of hidden input ($row['id'])

Answer 1

First of all, you are using #this1 (id) rather than class name.

input[name=albumid] also reads the first element, rather than element related to the clicked button.

to find album id you need to search it based on the clicked button, e.g.

var albumid = $(this).siblings('input[name=albumid]')

or

var albumid = $(this).prev('input[name=albumid]');

if you are not sure if the format of the html will stay the same, you can use following code:

var albumid = $(this).parents('div').find('input[name=albumid]');