Return after HttpPost in Partial View

0

Good evening,

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>

Given that I have a button inside a Form in partial

PArtialView.cshtml

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

Controller:

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

When I click the button, I can capture the event and make my changes to the partialView model, but upon return, only the partial view appears, instead of being updated within the View. Can someone tell me how to proceed? Thanks!

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 Main:

    @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);
            }

        }
    }
    
asked by anonymous 24.06.2014 / 23:05

1 answer

1

The error seems quite simple: you are not returning to View all because you are using an undue construct, in this case:

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

The correct would be to use 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, it guarantees the generation of Partials free of errors, instantiating new objects if the passed ones are null.

And no Controller:

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

To generate the Partial correctly, you need to generate the View correctly. So the return is View() .

EDIT

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

@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>
}
    
24.06.2014 / 23:12