Modal Bootstrap being closed

Asked

Viewed 254 times

0

I have the following scenario: a link that opens a modal.

<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>@ViewBag.Title - Sistema de Controle Operacional</title>

    @Styles.Render("~/Content/css")
    @Styles.Render("~/Content/themes/kendo")
    @Styles.Render("~/Content/blueimp/css/blueimp-gallery")

    <link rel="Stylesheet" href="~/Content/bootstrap/datepicker/bootstrap-datetimepicker.min.css" media="screen" />
    <link rel="Stylesheet" href="~/Content/Site.css" media="screen" />
    <link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css" rel="stylesheet">
    <link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">

    @Scripts.Render("~/bundles/modernizr")
    @Scripts.Render("~/bundles/jquery")
    @Scripts.Render("~/bundles/bootstrap")

    <!--[if IE]><script type="text/javascript" src="../../Scripts/excanvas_r3/excanvas.compiled.js"></script><![endif]-->
</head>

<div id="divHistorico" class="modal fade">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
                <h4 class="modal-title">Modal title</h4>
            </div>
            <div class="modal-body">
                <p>One fine body…</p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                <button type="button" class="btn btn-primary">Save changes</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

<a data-toggle="modal" data-target="#divHistorico">
    <img src="~/Content/icons/history.png" style="width:24px;cursor:pointer;" title="Histórico" />
</a>


@Scripts.Render("~/lightboxGallery")
@Scripts.Render("~/bundles/kendo")
@RenderSection("scripts", required: false)

<script src="~/Scripts/bootstrap-datetimepicker.min.js"></script>
<link rel="stylesheet" type="text/css" href="~/Content/plugins/datetimepicker/jquery.datetimepicker.css" />
<script src="~/Content/plugins/datetimepicker/jquery.datetimepicker.js"></script>

<script src="~/Content/datatable/jquery.dataTables.min.js"></script>
<script src="~/Content/datatable/dataTables.bootstrap.min.js"></script>
<script src="~/Content/datatable/date-eu.js"></script>

By clicking on link, the modal is open, but soon after it is closed, not being open as I wish. What I need to do ?

  • Dude, here it worked properly, take a look at the version of your bootstrap and make sure there’s no other script affecting it directly, working example

  • True, this code opens a modal perfectly, and it stays until you close, it’s not closing automatically. See if you have any javascript that is setting some timeout to close the modal.

  • I inserted all my js and css that are being referenced in order on my page. @Ricardopunctual

1 answer

0


Solved.

I commented on the following line and it is working normally:

@Scripts.Render("~/bundles/bootstrap")

Browser other questions tagged

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