Load information on modal inputs based on the id sent by clicking the link data-id

Using the bootstrap documentation, I made a change from a href to button

<button type="button" class="btn-a" data-toggle="modal" data-target="#EditaFoto" 
    data-whatever="<?php echo $row['idfoto']; ?>"  
    data-whateverdatavisita="<?php echo $row['datavisita']; ?>" 
    data-whateveridvisita="<?php $row['idvisita']; ?>" 
    data-whateverpercetandamento="<?php $row['percentandamento']; ?>"
    data-whatevercaminhofoto="<?php $row['caminhofoto']; ?>"
    data-whateverdescricaofoto="<?php $row['descricaofoto']; ?>"
    >
 <i class="fas fa-edit"></i>

When you click the button it loads the information and sends it to Modal.

No JS:

$('#EditaFoto').on('show.bs.modal', function (event) {
    var button = $(event.relatedTarget) // Button that triggered the modal
    var recipient = button.data('whatever') // Extract info from data-* attributes
    var recipientdatavisita = button.data('whateverdatavisita')
    var recipientidvisita = button.data('whateveridvisita')
    var recipientpercetandamento = button.data('whateverpercetandamento')
    var recipientcaminhofoto = button.data('whatevercaminhofoto')
    var recipientdescricaofoto = button.data('whateverdescricaofoto')

    var modal = $(this)
    modal.find('.modal-title').text('ID Foto ' + recipient)
    modal.find('#datavisita').val(recipientdatavisita)
    modal.find('#idvisita').val(recipientidvisita)
    modal.find('#percentandamento').val(recipientpercetandamento)
    modal.find('#caminhofoto').val(recipientcaminhofoto)
    modal.find('#descricaofoto').val(recipientdescricaofoto)

})

But in the case it's only working these two parts:

data-whatever="<?php echo $row['idfoto']; ?>"  
data-whateverdatavisita="<?php echo $row['datavisita']; ?>" 

The rest are not loaded. In PHP everything is fine and the data is coming in to feed the variables.