Multiple calls to modal bootstrap

Asked

Viewed 213 times

0

Good morning.

By clicking a button, this button calls a modal, whose call happens twice, and I can’t understand why this call is coming twice as you can see in the following picture.

inserir a descrição da imagem aqui

Call of the model

<p>
    <a href="#" 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 with 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>
  • The question was very difficult to understand... I didn’t understand what you need, and you say "model code that is in error", which model? the correct would not be View ?

  • Yes, it would be a view called in modal, not model rs

  • Put the modal call script and include the modal code

  • The modal call is there and modal code too

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 by using your browser’s developer tools, which has support for this.

Catching the Google Chrome for example, when you launch the tool and inspect an element (I believe you know how to do this, using F12), in the "Elements" tab has another tab called "Event Listeners". Clicking there you will view all listeners associated, ie, all codes that open the modal, and will be able to identify that is duplicated.

See the example in the figure below, I got the "click" events associated with the image of upvote here on the website:

inspecionar elemento

So you’ll be able to identify that it’s triggering the click, and find the duplicate code.

If you want something more elaborate, install the "Visual Event" extension from Google Chrome that brings an even clearer view of events: Chrome.google.com/webstore/Detail/visual-Event/

  • Thank you very much, I found where it was duplicated.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.