Return after Httppost in Partial View

Question

Good night,

I’m working with Bootstrap 3 tabs, and I have the following structure:

View.cshtml

<div class="tab-content">
    <div id="tab_cooperado" class="tab-pane fade">
        @{Html.RenderPartial("PartialView", new Model());}
    </div>
    <div id="tab_visitantes" class="tab-pane fade">
        @{Html.RenderPartial("PartialView_2", new Model_2());}
    </div>       
</div>

Since I have a button inside a Form in the partial

Partialview.cshtml

<div>
    <input type="submit" id='pesquisar' class="btn.large btn-danger btn-block" value="Limpar" name="p_comando">
 </div>

Controler:

[HttpPost]
    public ActionResult Metodo(Model p_Model)
    {
        //... alteraçoes no model
        return PartialView("~/PartialView.cshtml", p_model);
    }

By clicking the button, I can capture the event and make my changes to the partialView model, but when I return, only the partial view appears, instead of being updated within the View. Can anyone tell me how to proceed? Thank you!

EDIT 2:

Models:

    namespace Web.Models
    {
        public class MainModel
        {
            public string id { get; set; }
            public PartialModel_1 partialModel_1 { get; set; }
            public PartialModel_2 partialModel_2 { get; set; }
        }

        public class PartialModel_1
        {
            public string id { get; set; }
            public string nome { get; set; }
        }

        public class PartialModel_2
        {
            public string id { get; set; }
            public string nome { get; set; }
        }
    }

View Principal:

    @model Web.Models.MainModel

    <ul class="nav nav-tabs form-tabs">
        <li id="basic-list" class="active">
            <a data-toggle="tab" href="#tab_cooperado">Aba_1</a>

        </li>
        <li class="" id="team_details-list">
            <a data-toggle="tab" href="#tab_visitantes">Aba_2</a>

        </li>
    </ul>

    @using (Html.BeginForm("MainMetodo", "Home"))
    {
        @Html.HiddenFor(model => model.id)
        <div class="tab-content">
            <div id="tab_cooperado" class="tab-pane fade active in">
                @Html.Partial("Partial1", Model.partialModel_1 ?? new Web.Models.PartialModel_1())
            </div>
            <div id="tab_visitantes" class="tab-pane fade">
                @Html.Partial("Partial2", Model.partialModel_2 ?? new Web.Models.PartialModel_2())
            </div>
        </div>

    }

Partial_1:

    @model Web.Models.PartialModel_1

    <div class="row">
        <div class="span1">
            @Html.LabelFor(model => model.id)
        </div>
        <div class="span2">
            @Html.TextBoxFor(model => model.id)
        </div>
    </div>
    <div class="row">
        <div class="span1">
            @Html.LabelFor(model => model.nome)
        </div>
        <div class="span2">
            @Html.TextBoxFor(model => model.nome)
        </div>
        <div class="span4">
            <input type="submit" class="btn.large btn-success btn-block" value="Pesquisar" name="p_comando" />
        </div>
    </div>

Partial_2:

    @model Web.Models.PartialModel_2

    <div class="row">
        <div class="span1">
            @Html.LabelFor(model => model.id)
        </div>
        <div class="span2">
            @Html.TextBoxFor(model => model.id)
        </div>
    </div>
    <div class="row">
        <div class="span1">
            @Html.LabelFor(model => model.nome)
        </div>
        <div class="span2">
            @Html.TextBoxFor(model => model.nome)
        </div><div class="span4">
        <input type="submit" class="btn.large btn-success btn-block" value="Pesquisar" name="p_comando" />
    </div>
    </div>

Controller:

    namespace Web.Controllers
    {
        public class HomeController : Controller
        {
            public ActionResult About()
            {
                MainModel model = new MainModel();
                return View(model);
            }

            [HttpPost]
            public ActionResult MainMetodo(MainModel model)
            {
                //Partials chegam nulas no Model!!

                //Oque devo retornar aqui, para que somente o valor da PARTIAL view
                //onde o botão foi clicado, seja atualizado dentro da minha aba!!
                return View(model);
            }

        }
    }

Answer 1

The error seems quite simple: you are not returning to View all because it is using an improper construction, in this case, this:

@{Html.RenderPartial("PartialView", new Model());}
@{Html.RenderPartial("PartialView_2", new Model_2());}

The right thing would be to use it like this:

@{Html.RenderPartial("PartialView", Model.Cooperado ?? new Model());}
@{Html.RenderPartial("PartialView_2", Model.Visitantes ?? new Model_2());}

The operator ?? ensures that if the left part is null, you can pass an alternative on the right side. Therefore, ensures the generation of Partials error-free, instantiating new objects if the past is null.

And in Controller:

[HttpPost]
public ActionResult Metodo(Model p_Model)
{
    //... alteraçoes no model
    return View(p_model);
}

To generate the Partial correctly, it is necessary to generate the View correctly. Hence the return is View().

---

EDIT

A few more things are missing. In View main, lacked a @using (Html.BeginForm()) and the hidden primary key:

@model Web.ViewModels.Fenicoopa.Recepcao

@using (Html.BeginForm()) 
{
    @Html.HiddenFor(model => model.RecepcaoId)

    <div class="col-md-7">

        <ul class="nav nav-tabs form-tabs" id="tab_recepcao">
            <li class="">
                <a data-toggle="tab" href="#tab_cooperado">Cooperados</a>

            </li>
        </ul>
    </div>
    <div class="tab-content">
        <div id="tab_cooperado" class="tab-pane fade">
            @Html.RenderPartial("BuscaCooperado", Model.m_CooperadoComDependente ?? new Web.ViewModels.Fenicoopa.CooperadoComDependentes())
        </div>
    </div>
}