inviare email tramite ajax ma prima devo scegliere un fornitore da un modal con bootstrap

[allin81]

Buongiorno
ad oggi, quando clicco su un bottone, invio una email ad un unico fornitore, e subito sotto al bottone faccio comparire la scritta "email inviata" senza cambiare pagina.

Il tutto lo faccio con questo codice:

<script>
$(document).ready(function(){
  $("#invia-conferma-fornitore-<?=$id_trasferimento?>").click(function(){
    $.get("mail-conferma-fornitore-del-servizio.php?id_trasferimento=<?=$id_trasferimento?>", function(data, status){
            $('#email-invia-conferma-fornitore').html(data);
    });
  });
});
</script>

Il bottone invece lo creo cosi':

<button type="submit" id="invia-conferma-fornitore-$id_trasferimento" name="invia-conferma-fornitore-$id_trasferimento" class="btn btn-outline-success mb-2 me-4" onclick="if(!confirm('Sei Sicuro?')){ event.stopImmediatePropagation(); return false;}">INVIA CONFERMA AL FORNITORE</button><div id="email-invia-conferma-fornitore" align="center"></div>

Adesso invece vorrei cliccare sul bottone, aprire il modal di bootstrap dove selezionare con una select un fornitore tra quelli presenti e quando clicco su "invia" mi si deve chiudere il modal ed inviare l'email come prima, quindi sempre senza cambiare la pagina, facendo uscire la scritta "email inviata".

Non ho problemi a far comparire i modal con quello che mi occorre, ma come faccio il resto?
Devo modificare in qualche modo il codice che ho postato?
Grazie

[allin81]

Buongiorno, riformulo la domanda, non voglio mandare l'email con ajax, vorrei solo che dopo aver cliccato sull'ok nel modal (dopo aver selezionato il fornitore), il modal si chiude e viene inviata l'email come prima, facendo apparire nel seguente div il messaggio di invio email

<div id="email-invia-conferma-fornitore" align="center"></div>