How to know which select option was selected after opening the modal?

Question

I am using the routine below to work with various options of the same modal, this is the correct way to do?

$(document).ready(function () {
 
                $("#btnok").on("click", function () {
                    $("#confirma").find("#target").val($(this).val());
                    $("#confirma").modal();
                });
                $("#sel_tipo").on("change", function () {
                    $("#confirma").find("#target").val($(this).val());
                    $("#confirma").modal();
                });

                $("#confirma").on("show.bs.modal", function () {

                    var key = $(this).find("#target").val();
                    var btnsim = $(this).find("#btn-sim");
                    var btnnao = $(this).find("#btn-nao");
                    var modaltitle = $(this).find("#confirma_title");
                    var modalbody = $(this).find("#confirma_body");

                    $(btnsim).html("Sim").show();
                    $(btnnao).html("Não").show();

                    switch (key) {
                        case "btn":
                            $(modaltitle).html("Janela do botão");
                            $(modalbody).html("Mensagem do botão");
                            break;
                        case "quitacao":
                            $(modaltitle).html("Quitação");
                            $(modalbody).html("Mensagem de quitação");
                            break;
                        case "entrega":
                            $(modaltitle).html("Janela de entrega");
                            $(modalbody).html("Mensagem de entrega");
                            break;
                        case "visualizar":
                            $(modaltitle).html("Janela de visualização");
                            $(modalbody).html("Mensagem de visualização");
                            break;
                        default:
                            $(modaltitle).html("Janela da opção: " + key);
                            $(modalbody).html("Mensagem da opção: " + key);
                            break;
                    }

                    $(btnsim).one("click", function () {

                        $(btnsim).hide();
                        $(btnnao).html("Fechar");

                        switch (key) {
                            case "btn":
                                alert("processo de " + key + " ok");
                                break;
                            case "quitacao":
                                alert("processo de " + key + " ok");
                                break;
                            case "entrega":
                                alert("processo de " + key + " ok");
                                break;
                            case "visualizar":
                                alert("processo de " + key + " ok");
                                break;
                            default:
                                alert("processo de " + key + " ok");
                                break;
                        }
                    });

                });
            });

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">

<script src="https://code.jquery.com/jquery-3.4.1.slim.min.js" integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>


<div id="confirma" class="modal fade" tabindex="-1" role="dialog">
            <input type="hidden" id="target" value=""/>
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header" style="background: #f0ad4e; border-radius: 6px 6px 0 0;">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                        <h4 class="modal-title" id="confirma_title">Título</h4>
                    </div>
                    <div class="modal-body" id="confirma_body">
                        <p>Texto</p>
                    </div>
                    <div class="modal-footer">
                        <button type="button" id="btn-nao" class="btn btn-default" data-dismiss="modal">
                            <!--span class="bootstrap-dialog-button-icon glyphicon glyphicon-remove"></span-->
                            Não
                        </button>
                        <button type="button" id="btn-sim" class="btn btn-primary">
                            <!--span class="bootstrap-dialog-button-icon glyphicon glyphicon-ok"></span-->
                            Sim
                        </button>
                    </div>
                </div><!-- /.modal-content -->
            </div><!-- /.modal-dialog -->
        </div><!-- /.modal -->
        
        
        <button type="button" id="btnok" value="btn">
            Abrir
        </button>

        <select id="sel_tipo">
            <option value="quitacao">Opcao 1</option>
            <option value="baixa">Opcao 2</option>
            <option value="visualizar">Opcao 3</option>
            <option value="opcao4">Opcao 4</option>
            <option value="opcao5">Opcao 5</option>
        </select>

Answer 1

How you are making the modal work through the attributes data- it is not necessary to call the method to show the modal manually.

$("#myModal").modal("show");

Just remove that chunk of code below and you’re done:

$("#sel").on("change", function(){
     var valor = $(this).val();
     // Como mando o valor para o "e" do myModal ?   

     console.log($("#myModal").data(e));
     $("#myModal").modal("show");

});

Watch it run in this example.