Tenho uma modal que é aberta quando a aplicação é iniciada, fiz a verificação se é a primeira vez que o usuario loga no sistema por meio de um cookie. O problema é que quando a modal é obrigada a executar, ela não carrega o style, segue um print de como ela abre quando a aplicação obriga ela a executar:
Porém, se eu ir para outra view e abrir a modal, chamando por botão, ela abre normalmente, com o style carregado, segue print:
Após isso, caso eu volte para view Home(Onde ela é chamada forçada quando a aplicação é iniciada) e clique no botão para exibir a modal, ela carrega o style normalmente.
O segundo caso é, Quando eu inicio a aplicação, ela exibe a modal sem o style, e caso eu permaneça na pagina e clique no botão de exibir a modal, ele continua exibindo sem style, ele so volta a exibir com style caso eu mude de pagina.
OBS: Tentei fazer isso usando outras paginas além da "home" para receber a modal quando inicia a aplicação, para ver se o problema era nela, mas em todas da o mesmo problema.
Segue o código que chama a minha modal quando ela é iniciada:
<div class="modal fade" id="OpenModal" role="dialog" style="text-align:center;vertical-align:middle">
<div class="container" style="border:#000000">
<div class="modal-dialog-sm" style="margin-left:240px">
<div class="modal-content" style="height:110px;width:500px">
<div class="modal-body" id="ModalBody">
</div>
</div>
</div>
</div>
</div>
<script>
// Obtém todos os cookies do documento
$(document).ready(function () {
var cookies = document.cookie;
// Verifica se o cookie existe
if (cookies.indexOf("Facility") == -1) {
// Entra aqui caso o cookie não exista no navegador do usuário
//var diasparaexpirar = 2;
//var expiracao = new Date();
//expiracao.setTime(expiracao.getTime() + (diasparaexpirar * 60 * 60 * 1000));
// Converte a data para string
//expiracao = expiracao.toUTCString();
// Crio o cookie com a data de expiração
document.cookie = 'Facility=null; path = /'
// Exibo o modal
$('#ModalBody').html('<iframe width="100%" height="100%" frameborder="0" allowtransparency="true" src="/Facility/ActiveFacility"></iframe>');
$("#OpenModal").modal("show");
}
});
</script>
Ele cria o Cookie para saber se a aplicação esta sendo iniciada e exibir a modal, e renderiza a modal, e o body ele renderiza uma outra pagina da minha aplicação, que é a pagina da modal. Fiz essa modal externa pois ela será utilizada em diversas partes do programa. Codigo da modal:
<script type="text/javascript" src="~/Scripts/View/ActiveFacility.js"></script>
<div class="form-horizontal">
<fieldset>
<div class="col-lg-12">
<label>Teste</label>
</div>
@using (Ajax.BeginForm("", "", null, new { @class = "form-signin", id = "formActive", name = "formActive" }))
{
<div class="col-lg-12">
@Html.DropDownList("Facilities", ViewBag.Facilities as SelectList, new { @class = "Form-control" })
</div>
<div class="col-lg-12">
<button type="button" class="btn btn-success " style="margin-top: 10px;margin-bottom:5px;" onclick="Save();">Teste</button>
</div>
}
</fieldset>
</div>
Como ja disse anteriormente, tenho um botão também que abre essa mesma modal, o botão utiliza o mesmo codigo do que renderiza a modal quando a aplicação é iniciada, sendo as duas ultimas linhas do codigo:
// Exibo o modal
$('#ModalBody').html('<iframe width="100%" height="100%" frameborder="0" allowtransparency="true" src="/Facility/ActiveFacility"></iframe>');
$("#OpenModal").modal("show");