Receive id in modal to delete record

Question

I have a page called produtos.php, where I list all products from my database, each product is on a table and each one has its respective button of details,edit and delete, I can pass the id for my excludes button but I can’t catch it on modal.

modal

<!-- Modal -->
        <div class="modal fade" id="delete-modal" tabindex="-1" role="dialog" aria-labelledby="modalLabel">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Fechar"><span aria-hidden="true">&times;</span></button>
                        <h4 class="modal-title" id="modalLabel">Excluir Item</h4>
                    </div>
                    <div class="modal-body">
                        Deseja realmente excluir este item? <span class="nome"></span>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-primary delete">Sim</button>
                        <button type="button" class="btn btn-default" data-dismiss="modal">N&atilde;o</button>
                    </div>
                </div>
            </div>
        </div>

I don’t know much about JS

$('.modal').on('click', function () {
    var nome = $(this).data('nome'); 
    var id = $(this).data('id'); 
    $('span.nome').text(nome + ' (id = ' + id + ')'); 
    $('.delete').attr('href', 'apagar.php?id=' + id); 
    $('#delete-modal').modal('show'); 

});

HTML/php of the button that opens the modal:

<a class="btn btn-danger btn-xs"     href="apagar.php?id=<?php echo   $linha['id_produto']; ?>" data-toggle="modal" data-nome="<?php echo $linha['nome'] ?>" data-id="<?php echo $linha['id_produto'] ?>" data-target="#delete-modal">Excluir</a>

This is my button.

Answer 1

Try the following:

$('a[data-target="#delete-modal"]').on('click', function (e) { 
    e.preventDefault();
    var nome = $(this).data('nome'); var id = $(this).data('id');
    $('span.nome').text(nome + ' (id = ' + id + ')');
    $('.delete').attr('href', 'apagar.php?id=' + id);
    $('#delete-modal').modal('show');
    return false;
});