-2

Estou tentando carregar dados de forma assincrona na página usando Ajax, com um método JS realizo a chamada para controller e a controller me devolve uma PartialView, que é renderizada corretamente, nessa partial existe um votão que chama uma modal, antes de fazer a requisição via ajax o botão funciona perfeitamente abrindo a modal (quando carego a página), depois que faço a pesquisa e a parte da pagina é modificada, o botão não abre mais a modal.

Onde a Partial é carregada

<div class="row">
    <div class="col-md-12">
        <h5>
            Visualizar compromissos a partir de:
            <input type="date" class="form-control-static text-box single-line" id="dataPesquisa" value="@DateTime.Today" />
            <button type="button" event.preventDefault() class="btn btn-primary" id="pesquisaCompromissos"><i class="fa-solid fa-magnifying-glass"></i></button>
        </h5>
    </div>
</div>

<div id="compromissos">
    @Html.Partial("_Compromissos");
</div>

A requisição:

$('#pesquisaCompromissos').click(function () {
                var dataPesquisa = $('#dataPesquisa').val();
                var partes = dataPesquisa.split("-");
                var dataFormatada = partes[2] + "/" + partes[1] + "/" + partes[0];

                $.ajax({
                        type: 'POST',
                        url: '@Url.Action("ExibeCompromissos", "Eventos")',
                    datatype: 'html',
                    cache: false,
                    async: true,
                        data: { dataFormatada: dataFormatada},
                    success: function (data) {
                        $('#compromissos').html("");
                        $('#compromissos').html(data);
                        },
                        error: function (ex) {
                            alert('Falha ao buscar.' + ex);
                        }
                 });
            })

A controller:


public ActionResult ExibeCompromissos(DateTime? dataFormatada)
        {
            var usuario = db.Vendedores.Where(u => u.NOME == User.Identity.Name).FirstOrDefault();

            
            if (dataFormatada != null)
            {
                
                var compromissosBusca = db.Eventos.Where(e => e.EVENTO_RESPONSAVEL == usuario.NOME && e.EVENTO_STATUS == "S" && e.DATA_AGENDADA >= dataFormatada).OrderBy(e => e.DATA_AGENDADA).ToList();
                return PartialView("_Compromissos", compromissosBusca);

            }
            var amanha = DateTime.Today.AddDays(1);
            
            var compromissos = db.Eventos.Where(e => e.EVENTO_RESPONSAVEL == usuario.NOME && e.EVENTO_STATUS == "S" && e.DATA_AGENDADA >= DateTime.Today && e.DATA_AGENDADA < amanha).ToList();
            return PartialView("_Compromissos", compromissos);
        }

O botão da partial


 <td><a class="fa-solid fa-magnifying-glass verCompromisso" data-id="@Html.DisplayFor(modelItem => item.EventosId)"></a>
</td>

inserir a descrição da imagem aqui

1 Resposta 1

-1

Quando você renderiza a PartialView novamente ela perde os seus event handlers, uma forma de resolver isso é registrar ele novamente após a requisição ou registrar no document, ao invés de ser no botão em si usando $(document).on('click', '#botao', function() { })

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 .