Questions about how to create a Change Event in a Combobox to update a PartialView

0

In my Asp.net MVC project an Index view contains a block in which you open the PartialViews Edit Details and Delete in a Modal window. Everything works 100%, but I'm having a problem with the Event of my "PersonNature" Combobox that is not working the Change event.

The combobox PersonNature is in the PartialView _Person and is rendered inside the PartialView Create. When I select a PersonNature, in the combobox, in thesis, one must give a POST for the Action to change some data and return again to the PartialView Create in Modal form, but this is not happening. The change event is not responding ... I tried to do it in other ways, but when it gave the post, it did not return the modal window and ended up opening the view on a new page ... What should I do? p>

MyJSFile:

$(document).ready(function () {
    $.ajaxSetup({ cache: false });
    // busca los elementos el atributo data-modal y le suscribe el evento click
    $('a[data-modal]').on('click', function (e) {
        // Abre la ventana modal con el formulario solicitado 
        openmodal(this.href);
        return false;
    });
    $('#modalPessoa').on('hidden.bs.modal', function () {
        $('#contentModal').html('');
    }); 
    $('#PessoaNatureza').on('change', function () {
       openmodal(this.href);
        return false;
    });
   
});

function openmodal(url) {
    // Hace una petición get y carga el formulario en la ventana modal
    $('#contentModal').load(url, function () {
        $('#modalPessoa').modal({
            keyboard: true
        }, 'show'); 
        //Evento changed para poder alterar o tipo de pessoa
        //$("#PessoaNatureza").change(function () {
        //   document.getElementById('frmCreate').submit();
        //}); 
              
        
        // Suscribe el evento submit
        bindForm(this);
    });
}
function bindForm(dialog) {
    // Suscribe el formulario en la ventana modal con el evento submit
    $('form', dialog).submit(function () {
        if ($(this).valid()) {
            // Realiza una petición ajax
            $.ajax({
                url: this.action,
                type: this.method,
                data: $(this).serialize(),
                success: function (result) {
                    // Si la petición es satisfactoria, se recarga la página actual
                    if (result.success) {
                        window.location = window.location;
                        window.location.reload(); //Ajuda na exclusao, atualizando o grid

                    } else {
                        $('#contentModal').html(result);
                        bindForm();
                    }
                }
            });
            return false;
        } else {
            return false;
        }
    });
}

<div class="modal fade" data-backdrop="static" id="pessoaHistory" role="dialog">
    <div class="modal-dialog" style="width: 95%; height: 500px;">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">Histórico de Alterações</h4>
            </div>
            <div class="modal-body scoll-tree">
                <p id="pessoaHistoryData"></p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Fechar</button>
            </div>
        </div>
    </div>
</div>

@using SistemaComercial.Domain.ValueObjects
@model SistemaComercial.Application.ViewModels.Pessoa.PessoaViewModel
@{
    ViewData["Title"] = "Cadastrar Nova Pessoa";
}

<div>
    <form asp-action="Create" asp-controller="Pessoa" id="frmCreate">
        @Html.AntiForgeryToken()
        <div class="modal-shadow">
            <div class="modal-header modal-header-primary">
                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</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="nav-tabs-horizontal">
                        <ul class="nav nav-tabs" data-plugin="nav-tabs" role="tablist">
                            <li class="active" role="presentation">
                                <a data-toggle="tab" href="#exampleTabsOne" aria-controls="exampleTabsOne"
                                   role="tab">Dados Pessoais</a>
                            </li>
                            <li role="presentation">
                                <a data-toggle="tab" href="#exampleTabsTwo" aria-controls="exampleTabsTwo"
                                   role="tab">Documentos</a>
                            </li>
                            <li role="presentation">
                                <a data-toggle="tab" href="#exampleTabsThree" aria-controls="exampleTabsThree"
                                   role="tab">Endereços</a>
                            </li>
                            <li role="presentation">
                                <a data-toggle="tab" href="#exampleTabsFour" aria-controls="exampleTabsFour"
                                   role="tab">Contatos</a>
                            </li>
                        </ul>
                        <div class="tab-content padding-top-20">
                            <div class="tab-pane active" id="exampleTabsOne" role="tabpanel">
                                <div class="form-horizontal">

                                    @await Html.PartialAsync("_Pessoa")

                                    @if (Model.PessoaNatureza == PessoaNatureza.Fisica)
                                    {
                                        @*<div id="divPessoaJuridica">
                                                @await Html.PartialAsync("_PessoaJuridica")
                                            </div>*@
                                        <div id="divPessoaFisica">
                                            @await Html.PartialAsync("_PessoaFisica")
                                        </div>
                                    }
                                    else if (Model.PessoaNatureza == PessoaNatureza.Juridica)
                                    {
                                        @*<div id="divPessoaFisica" style="display:none">
                                                @await Html.PartialAsync("_PessoaFisica")
                                            </div>*@
                                        <div id="divPessoaJuridica">
                                            @await Html.PartialAsync("_PessoaJuridica")
                                        </div>
                                    }

                                </div>
                            </div>
                            <div class="tab-pane" id="exampleTabsTwo" role="tabpanel">
                            </div>
                            <div class="tab-pane" id="exampleTabsThree" role="tabpanel">
                            </div>
                            <div class="tab-pane" id="exampleTabsFour" role="tabpanel">
                            </div>
                        </div>
                    </div>

                    @*<div class="form-group">
                            <div class="col-md-offset-2 col-md-10">
                                <button type="submit" class="btn btn-success"><i class="icon wb-check" aria-hidden="true"></i> Gravar</button>
                                <a asp-action="Index" class="btn btn-danger">
                                    <span title="Retornar à Lista" class="icon wb-arrow-left"></span> Retornar à lista
                                </a>
                            </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>
    
asked by anonymous 16.05.2018 / 23:58

0 answers