My first question here.
I'm developing my first system using Asp.Net MVC.
In a View I call a Modal whose modal-content is a PartialView that contains scripts (jQuery). When I open the Modal for the first time everything happens as expected, but if I close Modal and open the scripts again they stop responding.
The modal-container put it in _Layout, because this way I can reuse it in other Modals.
In the _Layout it also has scripts for Modal "pattern" events like the one below that clears the cache for when a new modal is loaded:
$('#modal-container').on('hidden.bs.modal', function () {
$(this).removeData('bs.modal');
});
If I remove this event the scripts will work even when I open Modal a second time, but Modal is cached and when I open a new Modal the first Modal is always loaded.
Follow my code: Note: I have hidden the parts that I consider not relevant.
CreateEdit.cshtml
Call Action that returns PartialViewm
<div class="col-md-1 form-group">
@Html.LabelFor(model => model.Evento.CodChamada, "Cod Evento.")
<div class="input-group">
@Html.TextBoxFor(model => model.Evento.CodChamada, new { @class = "form-control" })
<a href="@Url.Action("OpenSearchEvento", "Formando")" id="btnSearchEvento" class="modal-link input-group-addon">
<i class="fa fa-search"></i>
</a>
</div>
</div>
FormingController.cs
[HttpGet]
public ActionResult OpenSearchEvento(SearchViewModel searchValues)
{
var model = GetEventos(searchValues);
return PartialView("_SearchEvento", model);
}
SearchEvento.cshtml
$(function () {
debugger;
$('#modal-style').css('width', '1250px');
$('#btnCreate, #actives-only').hide();
$('#table-eventos tr').on('click', function () {
$(this).addClass('selected')
.siblings()
.removeClass('selected')
.css('font-weight', 'normal');
var selectedSearchItem = $(this).find('td:first').html();
$('.selected').css('font-weight', 'bold');
});
$('#btnSelectEvento').on('click', function (e) {
e.preventDefault();
var codChamadaEvento = $('#table-eventos tr.selected td:eq(0)').text();
var nomeEvento = $('#table-eventos tr.selected td:eq(1)').text();
var EventolId = $('#table-eventos tr.selected').find('td:first').attr('data-evento-id');
if (lastEventoId != EventolId) {
if ($('#IsControlaRifa').is(':checked')) {
bootbox.confirm({
title: 'Alterar Evento',
message: 'Ao alterar o Evento do Formando Todas as Rifas do Formando serão excluídas',
buttons: {
cancel: {
label: '<i class="fa fa-times"></i> Cancelar',
className: "btn-default"
},
confirm: {
label: '<i class="fa fa-check"></i> OK',
className: "btn-danger"
}
},
callback: function (result) {
if (result) {
$.ajax({
url: '/Formando/DeleteAllRifasFormando',
ajaxasync: true,
cache: false,
method: 'POST',
data: { id: formandoId },
datatype: "text/html"
})
.done(function () {
$('#rifas-evento > tbody').html('');
$($('#tabs').find('li')[3]).hide();
$('#IsControlaRifa').prop('checked', false);
bootbox.alert('As Rifas do Formando foram excluidas com sucesso!');
$('#IsControlaRifa').addClass('readOnly');
$('#btnCreateReset').prop('disabled', true);
$('#btnReturn').attr('disabled', 'disabled');
})
.fail(function () {
bootbox.alert('O registro não existe!')
});
}
$('#IsControlaRifa').prop('checked', true);
bootbox.hideAll();
}
});
}
}
$('#Evento_CodChamada').val(codChamadaEvento);
$('#Evento_NomeEvento').val(nomeEvento);
$('#EventoId').val(EventolId)
$('#modal-container').modal('hide');
});
$('#btnSearch').on('click', function (e) {
e.preventDefault();
var searchTerm = $('#SearchTerm').val();
var searchItem = $('#SearchItem').val();
var isPartial = $('#IsPartial').is(':checked');
var searchViewModel = {
'IsPartial': isPartial,
'IsActivesOnly': true,
'SearchTerm': searchTerm,
'SearchItem': searchItem
}
$.ajax({
url: '/Formando/SearchEvento',
type: 'POST',
datatype: 'json',
contentType: 'application/json; charset=utf-8',
data: JSON.stringify(searchViewModel),
success: function (data) {
if (data != null && data.length > 0) {
for (i in data) {
var template = $('#eventotpl').html();
}
var html = Mustache.to_html(template, data);
$('#table-eventos tbody')
.empty()
.html(html);
}
else
bootbox.alert('A pesquisa não retornou resultados!');
},
error: function () {
bootbox.alert("Não foi possível Alterar o Contrato do Formando!")
}
})
debugger;
});
});
</script>
<script id="eventotpl" type="text/template">
{{#.}}
<tr>
<td class="rv-cod-chamada" data-evento-id={{Id}}>{{CodChamada}}</td>
<td>{{NomeEvento}}</td>
<td class="rv-active-icon">{{#IsControlaRifa}} <span><i class='glyphicon glyphicon-ok'></i></span>
{{/IsControlaRifa}} {{^IsControlaRifa}} <i class='glyphicon glyphicon-remove'></i></td> {{/IsControlaRifa}}
</tr>
{{/.}}
</script>