1

Por que meu modal não fecha?

Não consegui achar nada de errado, principalmente quando comparado a outros modais parecidos que eu tenho.

Quando eu clico no botão de fechar, ele não dá o dismiss, não entendo.

O JS está adicionado e eu tenho outros modais parecidos com esse no meu sistema, não sei o que há de errado com esse.

Alguém pode me ajudar?

    <!-- Modal -->
<div class="modal fade" id="adicionar" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title" id="myModalLabel">Adicionar</h4>
            </div>

            <div class="modal-body">
                {{ Form::open(array('route' => array('tipos.store'), 'method' => 'POST')) }}
                <div class="row">
                    <div class="col-sm-12">
                        <div class="form-group">
                            <label for="">Nome do tipo</label>
                            <input type="hidden" name="_token" value="<?php echo csrf_token(); ?>">
                            <input type="text" placeholder="Casa, Apartamento, Sobrado..." required name="nome" id="" class="form-control">
                        </div>
                    </div>
                </div>

                <hr>

                <div class="row">
                    <div class="col-sm-12">
                        <div class="form-group">
                            <button type="submit" class="btn btn-success waves-effect waves-light">Salvar</button>
                        </div>
                    </div>
                </div>
                {!! Form::close() !!}
            </div>
        </div>
    </div>
</div>
2
  • Parece não haver nada de errado na modal. Faz um teste: execute este código no console $("#adicionar > div > div > div.modal-header > button").click(function(){alert("ok")}) ... depois clique no X da modal e veja se o alert é disparado.
    – Meu ovo
    31/12/2017 às 22:49
  • Você pode colocar na pergunta a biblioteca usada e o modo como abre o modal, se auto ou clicando em um elemento?
    – user60252
    1/01/2018 às 12:42

1 Resposta 1

1

Não há erros no código postado, mas seria necessário que você colocasse na sua pergunta a biblioteca utilizada e o modo como abre o modal conforme exemplos abaixo

1 - Auto

 $("#adicionar").modal('show');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
 <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
 <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

<!-- Modal -->
<div class="modal fade" id="adicionar" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title" id="myModalLabel">Adicionar</h4>
            </div>

            <div class="modal-body">
                {{ Form::open(array('route' => array('tipos.store'), 'method' => 'POST')) }}
                <div class="row">
                    <div class="col-sm-12">
                        <div class="form-group">
                            <label for="">Nome do tipo</label>
                            <input type="hidden" name="_token" value="<?php echo csrf_token(); ?>">
                            <input type="text" placeholder="Casa, Apartamento, Sobrado..." required name="nome" id="" class="form-control">
                        </div>
                    </div>
                </div>

                <hr>

                <div class="row">
                    <div class="col-sm-12">
                        <div class="form-group">
                            <button type="submit" class="btn btn-success waves-effect waves-light">Salvar</button>
                        </div>
                    </div>
                </div>
                {!! Form::close() !!}
            </div>
        </div>
    </div>
</div>

2- Clicando em botão

  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
  

  <button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#adicionar">Abrir Modal</button>

  <!-- Modal -->
  <div class="modal fade" id="adicionar" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title" id="myModalLabel">Adicionar</h4>
            </div>

            <div class="modal-body">
                {{ Form::open(array('route' => array('tipos.store'), 'method' => 'POST')) }}
                <div class="row">
                    <div class="col-sm-12">
                        <div class="form-group">
                            <label for="">Nome do tipo</label>
                            <input type="hidden" name="_token" value="<?php echo csrf_token(); ?>">
                            <input type="text" placeholder="Casa, Apartamento, Sobrado..." required name="nome" id="" class="form-control">
                        </div>
                    </div>
                </div>

                <hr>

                <div class="row">
                    <div class="col-sm-12">
                        <div class="form-group">
                            <button type="submit" class="btn btn-success waves-effect waves-light">Salvar</button>
                        </div>
                    </div>
                </div>
                {!! Form::close() !!}
            </div>
        </div>
    </div>
</div>
  

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .