Jquery选择正确的id

Question

I create a dynamic table from a database:

//[..]Typical code to fetch data from the database
//$exp_id comes from the database
<td><input = type = 'hidden' value = '".$exp_id."' id = 'exp_id'/><input type = 'button' id = 'alpha' value = 'a' onclick = $('.ui.small.modal').modal('show'); /></td>

I want to post the ID of an entry and get the results on a modal. The problem is that it takes only the ID from the first entry. When I test it with a single button and a single text box (I put the IDs manually - not from the database) it works without any problem Jquery:

$(document).ready(function(){
$('#alpha').click(function(){
id = $('#exp_id').val();
//alert(id);
$.post('find_expert.php',{exp1:id},function(res){
$(".content").html(res);
});
});
});

Any ideas please?

Answer 1

IDs must be unique. Use classes instead:

<td>
    <input = type = 'hidden' class='saveme' value = '".$exp_id."'/>
    <input type = 'button' class='clickme' value = 'a' onclick = $('.ui.small.modal').modal('show'); />
</td>

Use the clickme class selector to attach to the buttons click event, then find the sibling input:

$(document).ready(function(){
    $('.clickme').click(function(){
        id = $(this).parent().find('.saveme').val();
        //alert(id);
        $.post('find_expert.php',{exp1:id},function(res){
            $(".content").html(res);
        });
    });
});