Multiple bootstrap modal calls

0

Good morning.

When you click a button, this button calls a modal, whose call happens twice, and I can not understand why this call is coming twice as you can see in the following image.

Callingthemodel

<p><ahref="#" id="btnDistribuir" class="btn btn-success" data-action="Distribui" data-toggle='tooltip' data-placement='top' title='Distribuir Pedidos para Operação'>
        <span class="glyphicon glyphicon-plus"></span>
        Registro | Cadastrar | Create
    </a>
</p>

Model code that is in error

@model PortalLatam.Models.PedidosModel

@{
    ViewBag.Title = "Distribuir Documentos";
}

<h2>Distribuir Documentos para Operação</h2>

<style>
    .modal .modal-dialog {
        width: 60%;
    }
</style>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Distribuir</title>

</head>


    <div class="form-group">
        <div class="row">
            <div class="col-xs-8">

                <div class="form-group">
                    <label for="cmbColaboradores">Colaboradores</label>
                    <select class="form-control" id="cmbColaboradores"></select>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-xs-12">
                <div class="col-xs-12">
                    <input class="checkbox-inline" type="checkbox" name="chkSelecionaTodos" id="chkSelecionaTodos" />
                    <span>Selecionar todos</span>

                </div>

            </div>

        </div>
        <div class="row">
            <div class='col-xs-12'>
                <div class="col-xs-1">#</div>
                <div class="col-xs-2">Número do Protocolo </div>
                <div class="col-xs-3">Data do Protocolo </div>
                <div class="col-xs-3">Colaborador </div>
                <div class="col-xs-3">BP </div>
            </div>
        </div>

        <div class="row">

            <div id="pedidos">



            </div>

        </div>

        <div class="row">
            <div class="col-xs-12">
                <input type="button" class="btn btn-success" id="btnGravar" name="btnGravar" value="Gravar" />
            </div>

        </div>



    </div>




    @Scripts.Render("~/bundles/jqueryval")
    <script src="~/Scripts/projeto/EnviarFormulario.js"></script>
    <script src="~/Scripts/Projeto/DistribuiPedidoLatam.js"></script>

    <script type="text/javascript">

        var btnAcao = $("input[type='button']");
        var formulario = $("#formCrud");

    </script>
    
asked by anonymous 17.08.2018 / 17:53

1 answer

1

You need to identify the events associated with the button that are triggering the event that opens the modal.

There are several ways to do this, the simplest is using your browser's developer tools, which have support for this.

For example, by launching the tool and inspecting an element (I believe you know how to do this using F12 ), in the "Elements" tab, has another tab called "Event Listeners". By clicking on it you will see all associated listeners , that is, all the codes that open the modal, and will be able to identify that it is duplicated.

See the example in the figure below, which I took the click events associated with the upvote image here from the site:

Soyouwillbeabletoidentifywhatistriggeringtheclick,andfindtheduplicatecode.

Ifyouwantsomethingmoreelaborate,installtheGoogleChrome"Visual Event" extension that brings a clearer view of events: chrome.google.com/webstore/detail/visual-event/

    
23.08.2018 / 14:22