none
Problemas com exbição de máscaras de entada em PartialViews - Asp.Net Core RRS feed

  • 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>
    }

    segunda-feira, 11 de junho de 2018 15:56