Problemas com exbição de máscaras de entada em PartialViews - Asp.Net Core
Pergunta
-
Estou com problemas com as máscaras de entrada (bootstrap) em todas as telas. Achei interessante o seguinte: Todas as minhas Views que são retornadas em forma de "PartialView", as máscaras de entrada não funcionam. Para testes, quando eu crio uma View e um controlador que retorna uma View, tudo funciona corretamente. Isso evidencia claramente que o problema é causado pelo retorno em forma de PartialView do meu controller.
Tenho várias Views do CRUD que são abertas Em forma de modal a partir da minha Index. Elas só funcionam se o retorno for PartialView. Só que as mascáras de entrada não funcionam de jeito algum... Alguém sabe como resolver isso?
// Controller [HttpGet] [Authorize(Policy = "CanWriteCepData")] [Route("cep-gerenciamento/editar-cep/{id}")] public IActionResult Edit(string id) { if (id == null) { return NotFound(); } var cepViewModel = _cepAppService.GetByCepId(id); if (cepViewModel == null) { return NotFound(); } return PartialView(cepViewModel); }@using SistemaComercial.Domain.ValueObjects @model SistemaComercial.Application.ViewModels.Cep.CepViewModel @{ ViewData["Title"] = "Editar CEP"; } <div> <form asp-action="Edit"> @Html.AntiForgeryToken() <div class="modal-shadow"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal"><span aria-hidden="false">×</span><span class="sr-only">Close</span></button> <h4 class="modal-title text-center"> @ViewData["Title"] </h4> </div> <div class="form-horizontal"> <div id="validationSummary" class="text-center"> <vc:summary /> </div> <div class="panel-body"> <div class="form-group"> <label asp-for="CepId" class="col-md-2 control-label"></label> <div class="col-md-3"> <input id="txtCep" asp-for="CepId" class="form-control" data-plugin="formatter" data-pattern="[[99999]]-[[999]]" /> <span asp-validation-for="CepId" class="text-danger"></span> </div> </div> <div class="form-group"> <label asp-for="Endereco" class="col-md-2 control-label"></label> <div class="col-md-10"> <input id="txtEndereco" asp-for="Endereco" class="form-control text-uppercase" /> <span asp-validation-for="Endereco" class="text-danger"></span> </div> </div> <div class="form-group"> <label asp-for="Complemento" class="col-md-2 control-label"></label> <div class="col-md-5"> <input asp-for="Complemento" class="form-control text-uppercase" /> <span asp-validation-for="Complemento" class="text-danger"></span> </div> <label asp-for="Bairro" class="col-md-1 control-label"></label> <div class="col-md-4"> <input asp-for="Bairro" class="form-control text-uppercase" /> <span asp-validation-for="Bairro" class="text-danger"></span> </div> </div> <div class="form-group"> <label asp-for="Cidade" class="col-md-2 control-label"></label> <div class="col-md-7"> <input id="txtDescricao" asp-for="Cidade" class="form-control text-uppercase" /> <span asp-validation-for="Cidade" class="text-danger"></span> </div> </div> <div class="form-group"> <label asp-for="UF" class="col-md-2 control-label"></label> <div class="col-md-2"> <input asp-for="UF" class="form-control text-uppercase" maxlength="2" /> <span asp-validation-for="UF" class="text-danger"></span> </div> <div class="col-md-5"> <div class="checkbox-custom checkbox-default"> <input type="checkbox" asp-for="PadraoSistema" disabled /> <label asp-for="PadraoSistema"></label> </div> <span asp-validation-for="PadraoSistema" class="text-danger"></span> </div> </div> <div class="modal-footer"> <button id="btnSalvar" type="submit" class="btn btn-primary"><i class="icon wb-check"></i> Salvar </button> <a class="btn btn-danger" data-dismiss="modal"> <span title="Fechar" class="icon wb-close"></span> Fechar </a> </div> </div> </div> </div> </form> </div> @section Scripts { @{await Html.RenderPartialAsync("_ValidationScriptsPartial");} }<div class="form-group"> <label asp-for="CepId" class="col-md-2 control-label"></label> <div class="col-md-3"> <input id="txtCep" asp-for="CepId" class="form-control" data-plugin="formatter" data-pattern="[[99999]]-[[999]]" /> <span asp-validation-for="CepId" class="text-danger"></span> </div> </div>
//Minha Index com o Bloco Modal @{ ViewData["Title"] = "Gerenciar CEPS"; } <div class="panel animsition"> <div class="page-header"> <h1 class="page-title">@ViewData["Title"]</h1> <ol class="breadcrumb"> <li><a asp-action="Index" asp-controller="Home">Home</a></li> <li class="active">cep-gerenciamento/listar-todos</li> </ol> <div class="page-header-actions"> <div class="btn-group btn-group-sm" role="group"> <a id="btnNovo" asp-action="Create" data-modal="" class="btn btn-outline btn-default new" data-toggle="tooltip" data-original-title="Cadastrar Novo" data-container="body"> <span title="Cadastrar Novo" class="icon wb-plus"></span> Cadastrar Novo </a> <button type="button" class="btn btn-outline btn-default" data-toggle="tooltip" data-original-title="Configurações" data-container="body"> <i class="icon wb-settings" aria-hidden="true"></i> </button> <button type="button" class="btn btn-outline btn-default" data-toggle="tooltip" data-original-title="Exportar" data-container="body"> <i class="icon wb-upload" aria-hidden="true"></i> </button> <button type="button" class="btn btn-outline btn-default" data-toggle="tooltip" data-original-title="Importar" data-container="body"> <i class="icon wb-download" aria-hidden="true"></i> </button> <button type="button" class="btn btn-outline btn-default" data-toggle="tooltip" data-original-title="Imprimir" data-container="body"> <i class="icon wb-print" aria-hidden="true"></i> </button> <button type="button" class="btn btn-outline btn-default" data-toggle="tooltip" data-original-title="Pesquisa Avançada" data-container="body"> <i class="icon wb-search" aria-hidden="true"></i> <span class="hidden-xs">Pesquisa Avançada</span> </button> </div> </div> </div> <div class="page-content"> <table id="dtPrincipal" class="table table-striped table-bordered center-header " cellspacing="0" width="100%"> <thead> <tr> <th>Cep</th> <th>Endereço</th> <th>Complemento</th> <th>Bairro</th> <th>Cidade</th> <th>UF</th> <th>Ações</th> </tr> </thead> <tbody></tbody> </table> </div> </div> <div class="modal fade modal-primary" id="modalCep" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" data-backdrop="static"> <div class="modal-dialog" style="width: 50%; height: 500px;"> <div class="modal-content"> <div id="contentModal"></div> </div> </div> </div> @section scripts { @{await Html.RenderPartialAsync("_ValidationScriptsPartial");} <script src="~/js/cadastros/cep/cep.js"></script> }
