Preciso fechar um modal, e atualizar a página, estou fazendo desta forma:
function closeModal() {
$('#myModal').modal('hide');
location.reload();
}
Porém, na primeira vez não funciona, e depois funciona normal, alguém sabe o porque ? Ou algum outro código que possa atualizar, as informações do modal, são inclusas por uma função AJAX, que funciona, preciso apenas atualizar depois de fechar o modal.
<a href="#" onclick="SalvarItens(); closeModal();" class="btn btn-primary btn-sm">Gravar Item</a>
Eu salvo a função e depois fecho o modal. O que está ocorrendo que possa estar acontecendo esse comportamento estranho.
Edit, código: Por exemplo esta é a função para salvar:
function SalvarItens() {
var idItem = $("#idItem").val();
if (idItem == 0) {
var dataInicio = $("#txtHoraInicio").val();
var dataFim = $("#txtHoraFim").val();
var tipoLimite = $("#txtTipoLimite").val();
var limiteAcessos = $("#txtLimiteAcessos").val();
var cbSeg = $('#cbSeg').prop('checked');
var cbTer = $('#cbTer').prop('checked');
var cbQua = $('#cbQua').prop('checked');
var cbQui = $('#cbQui').prop('checked');
var cbSex = $('#cbSex').prop('checked');
var cbSab = $('#cbSab').prop('checked');
var cbDom = $('#cbDom').prop('checked');
var cbFer = $('#cbFer').prop('checked');
var idHorario = $("#idHorario").val();
var url = "/HorariosItens/SalvarItens";
$.ajax({
url: url
, data: { HoraInicio: dataInicio, HoraFim: dataFim, Seg: cbSeg, Ter: cbTer, Qua: cbQua, Qui: cbQui, Sex: cbSex, Sab: cbSab, Dom: cbDom, Fer: cbFer, Tipolimite: tipoLimite, Limiteacessos: limiteAcessos, HorarioId: idHorario }
, type: "POST"
, datatype: "html"
, success: function (data) {
if (data.resultado > 0) {
ListarItens(idHorario);
}
}
});
} else {
var dataInicio = $("#txtHoraInicio").val();
var dataFim = $("#txtHoraFim").val();
var tipoLimite = $("#txtTipoLimite").val();
var limiteAcessos = $("#txtLimiteAcessos").val();
var cbSeg = $('#cbSeg').prop('checked');
var cbTer = $('#cbTer').prop('checked');
var cbQua = $('#cbQua').prop('checked');
var cbQui = $('#cbQui').prop('checked');
var cbSex = $('#cbSex').prop('checked');
var cbSab = $('#cbSab').prop('checked');
var cbDom = $('#cbDom').prop('checked');
var cbFer = $('#cbFer').prop('checked');
var idHorario = $("#idHorario").val();
var url = "/HorariosItens/EditarItem";
$.ajax({
url: url
, data: { HoraInicio: dataInicio, HoraFim: dataFim, Seg: cbSeg, Ter: cbTer, Qua: cbQua, Qui: cbQui, Sex: cbSex, Sab: cbSab, Dom: cbDom, Fer: cbFer, Tipolimite: tipoLimite, Limiteacessos: limiteAcessos, HorarioId: idHorario, ItemId: idItem }
, type: "POST"
, datatype: "html"
, success: function (data) {
if (data.resultado > 0) {
ListarItens(idHorario);
}
}
});
}
}
function ListarItens(idHorario) {
var url = "/HorarioItem/Create";
$.ajax({
url: url
, type: "GET"
, data: { id: idHorario }
, datatype: "html"
, success: function (data) {
var divItens = $("#divItens");
divItens.empty();
divItens.show();
divItens.html(data);
$("#idItem").val("0");
$("#idHorario").val(idHorario);
//$('#myModal').modal('hide');
}
});
}
Este é o código que salva:
public ActionResult EditarItem(string HoraInicio, string HoraFim, bool Seg, bool Ter, bool Qua, bool Qui, bool Sex, bool Sab, bool Dom, bool Fer, int Tipolimite, int Limiteacessos, int HorarioId, int ItemId)
{
var item = new HorariosItens()
{
HoraFim = HoraFim,
HoraInicio = HoraInicio,
Seg = Seg,
Ter = Ter,
Qua = Qua,
Qui = Qui,
Sex = Sex,
Sab = Sab,
Dom = Dom,
Fer = Fer,
Tipolimite = Tipolimite,
Limiteacessos = Limiteacessos,
HorarioId = HorarioId,
Id = ItemId
};
try
{
_context.Entry(item).State = EntityState.Modified;
_context.SaveChanges();
}
catch (Exception ex)
{
throw ex;
}
return Json(new { Resultado = item.Id });
}
Ele inclui, edita, e exclui, ele apenas tem horas que não atualiza, e tem horas que atualiza.
Edit HTML:
div class="form-group">
<input type="button" value="Incluir Itens" onclick="abreModal();" class="btn btn-info btn-sm" />
</div>
<form method="post" id="createform">
@if (Model.Message != null) {
<div class="alert alert-info alert-dismissable" role="alert">
<button type="button" class="close" data-dismiss="alert" aria-label="close">
<span aria-hidden="true">×</span>
</button> @Model.Message
</div>
}
<input type="hidden" asp-for="HorariosVM.Horarios.Id" />
<div class="col-md-10">
<table class="table table-responsive" id="tabela">
<thead>
<tr>
<th>
@Html.DisplayNameFor(model => model.HorariosItens[0].HoraInicio)
</th>
<th>
@Html.DisplayNameFor(model => model.HorariosItens[0].HoraFim)
</th>
<th>
@Html.DisplayNameFor(model => model.HorariosItens[0].Seg)
</th>
<th>
@Html.DisplayNameFor(model => model.HorariosItens[0].Ter)
</th>
<th>
@Html.DisplayNameFor(model => model.HorariosItens[0].Qua)
</th>
<th>
@Html.DisplayNameFor(model => model.HorariosItens[0].Qui)
</th>
<th>
@Html.DisplayNameFor(model => model.HorariosItens[0].Sex)
</th>
<th>
@Html.DisplayNameFor(model => model.HorariosItens[0].Sab)
</th>
<th>
@Html.DisplayNameFor(model => model.HorariosItens[0].Dom)
</th>
<th>
@Html.DisplayNameFor(model => model.HorariosItens[0].Fer)
</th>
<th>
@Html.DisplayNameFor(model => model.HorariosItens[0].Tipolimite)
</th>
<th>
@Html.DisplayNameFor(model => model.HorariosItens[0].Limiteacessos)
</th>
<th></th>
</tr>
</thead>
<tbody>
@foreach (var item in Model.HorariosItens) {
<tr>
<td>
@Html.DisplayFor(modelItem => item.HoraInicio)
</td>
<td>
@Html.DisplayFor(modelItem => item.HoraFim)
</td>
<td>
@Html.DisplayFor(modelItem => item.Seg)
</td>
<td>
@Html.DisplayFor(modelItem => item.Ter)
</td>
<td>
@Html.DisplayFor(modelItem => item.Qua)
</td>
<td>
@Html.DisplayFor(modelItem => item.Qui)
</td>
<td>
@Html.DisplayFor(modelItem => item.Sex)
</td>
<td>
@Html.DisplayFor(modelItem => item.Sab)
</td>
<td>
@Html.DisplayFor(modelItem => item.Dom)
</td>
<td>
@Html.DisplayFor(modelItem => item.Fer)
</td>
<td>
@Html.DisplayFor(modelItem => item.Tipolimite)
</td>
<td>
@Html.DisplayFor(modelItem => item.Limiteacessos)
</td>
<td>
<a href="#" onclick="EditarItem(@item.Id);abreModal();" class="btn btn-primary btn-sm">Alterar</a>
<a href="#" onclick="ExluirItem1(@item.Id);" class="btn btn-danger btn-sm">Excluir</a> @*
<a asp-page="./Edit" class="btn btn-success btn-sm" asp-route-id="@item.Id">Editar</a>
<button asp-page-handler="Delete" asp-route-id="@item.Id" class="btn btn-danger btn-sm">Excluir</button>*@
</td>
</tr>
}
</tbody>
</table>
</div>
<div class="modal fade" id="myModal" tabindex="-1" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-body">
<div class="row">
<div class="col-md-12">
<div class="row form-group">
<div class="col-md-6">
<div class="form-group">
<div class="col-md-9">
<label class="control-label">Hora Inicio</label>
<input type="time" class="form-control" id="txtHoraInicio" />
</div>
</div>
<br />
<div class="form-group">
<div class="col-md-9">
<label class="control-label">Hora Fim</label>
<input type="time" class="form-control" id="txtHoraFim" />
</div>
</div>
<br />
<div class="form-group">
<div class="col-md-9">
<label class="control-label">Tipo Limite</label>
<input id="txtTipoLimite" class="form-control" type="text" />
</div>
</div>
<br />
<div class="form-group">
<div class="col-md-9">
<label class="control-label">Limite de Acesso</label>
<input id="txtLimiteAcessos" type="text" class="form-control" />
</div>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<div class="col-md-10">
<div class="checkbox">
<input type="checkbox" id="cbSeg" />
</div>
<label class="control-label">Segunda</label>
</div>
</div>
<div class="form-group">
<div class="col-md-10">
<div class="checkbox">
<input type="checkbox" id="cbTer" />
</div>
<label class="control-label">Terça</label>
</div>
</div>
<div class="form-group">
<div class="col-md-10">
<div class="checkbox">
<input type="checkbox" id="cbQua" />
</div>
<label class="control-label">Quarta</label>
</div>
</div>
<div class="form-group">
<div class="col-md-10">
<div class="checkbox">
<input type="checkbox" id="cbQui" />
</div>
<label class="control-label">Quinta</label>
</div>
</div>
<div class="form-group">
<div class="col-md-10">
<div class="checkbox">
<input type="checkbox" id="cbSex" />
</div>
<label class="control-label">Sexta</label>
</div>
</div>
<div class="form-group">
<div class="col-md-10">
<div class="checkbox">
<input type="checkbox" id="cbSab" />
</div>
<label class="control-label">Sabado</label>
</div>
</div>
<div class="form-group">
<div class="col-md-10">
<div class="checkbox">
<input type="checkbox" id="cbDom" />
</div>
<label class="control-label">Domingo</label>
</div>
</div>
<div class="form-group">
<div class="col-md-10">
<div class="checkbox">
<input type="checkbox" id="cbFer" />
</div>
<label class="control-label">Feriado</label>
</div>
</div>
</div>
</div>
<div class="form-group">
<a href="#" onclick="closeModal();" class="btn btn-primary btn-sm">Gravar Item</a>
<a href="#" onclick="fecha();" class="btn btn-danger btn-sm">Fechar</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</form>
O Create ele atualiza, porém ele não deixa mais fazer nenhuma função.