Modal opening using different links to the same table row

Question

I have the following table:

<table id="tabela">
    <thead>
      <tr>
         <th>Produto</th>
         <th>Cliente</th>
      </tr>
    </thead>
    <tbody>    
        <tr>
           <td id="produto1"><a href="" data-toggle="modal" data-target="#myModal">Banana</a></td>
           <td id="cliente1"><a href="" data-toggle="modal" data-target="#myModal">José da Silva</a></td>                   
        </tr>                
        </tbody>
</table>

As you can see, in the table I have 2 links on the same line, one link should show through a modal the product data and the other shows the customer data. To show the product modal I used the following Jquery script:

$(document).on("click","#tabela td a",function(e){
    e.preventDefault()
    var idproduto= $(this).parent().attr("id");    
    $('.modal-body').load('dados_produto.php?id='+idproduto);            
});

So far everything works perfectly, my problem is: how to create a new interaction with Jquery for the client link to open a modal to display the 'data_client.php file? id=+idclient'?

Answer 1

I was able to solve it this way: In the product link, the id goes with a name that indicates the column referring to information and concaten with a '-' separator plus the value of the id where the user clicked, thus staying: 'customer-1' or 'product-5'

In Jquery I give a split and separate the field that identifies the position in the table and the value of the clicked id.

$(document).on("click","#tabela td a",function(e){
    e.preventDefault()
    var linkClicadoComId = $(this).parent().attr("id").split('-');
    var tipo = linkClicadoComId[0];
    var id = linkClicadoComId[1];

    if(tipo == 'produto'){
        $('.modal-body').load('dados_produto.php?id='+id);
    }
    if(tipo == 'cliente'){
        $('.modal-body').load('dados_cliente.php?id='+id);
    }
});

Got mad, whoever wants it is there the resolution.