create tabs inside a tab view calling a controller action that returns a partial view

Question

I have created tabs using kendo tabs in below format. Now I want to create tabs inside the div and show partial views for each tab by calling a controller action and pass two parameters to that controller action that returns the partial view with its model data. I have checked so many solutions but could get a right solution which would solve my requirement. Can anyone help.

<ul>
    @foreach(var item in model)
        {
            <li>
                @item.DocumentVersion
            </li>
        }
</ul>
@foreach(var Document in model)
        {
            <div>
                <p>
                    @Document.Details
                </p>
                </br>
                <span>
                    @Document.File
                </span>
            </div>
        }

So do that...and post that if it does not work. i.e. **calling a controller action and pass two parameters to that controller action that returns the partial view with its model data.** - search "Partial View MVC" I would think — Mark Schultheiss, Apr 07 '17 at 21:00
@MarkSchultheissam hello .. its not about calling the controller action and passing parameters.I need to achieve tat in my tab view. I dont know how I can achieve that and landed up here. — user7721524, Apr 07 '17 at 21:04
http://stackoverflow.com/questions/16656073/action-returning-partial-view-and-model — Mark Schultheiss, Apr 07 '17 at 21:05
And HERE for how to pass parameters http://stackoverflow.com/questions/6549541/how-to-pass-parameters-to-a-partial-view-in-asp-net-mvc — Mark Schultheiss, Apr 07 '17 at 21:07
I know doing that i.e calling controller action and returning partial view. But I dont know how to do it to render the view in the tabs content — user7721524, Apr 07 '17 at 21:09
Like in my question you could see the tabs i have created. There should be list items and corresponding
to each

Mark Schultheiss · Accepted Answer · 2017-04-08T15:41:55.487

Render the partial IN the view (simplistic example)

<div>
@{Html.RenderPartial("MyPartialViewName",
    new { firstName = model.FirstName, lastName = model.LastName});
}
</div>

<div>
@{Html.RenderPartial("MyPartialViewName","MyController",
    new { firstName = model.FirstName, lastName = model.LastName});
}
</div>

Create parameter view action

[ChildActionOnly]
public ActionResult MyPartialViewName(string firstName, string lastName)
{
// create model here...
 var model = repository.GetThingByParameter(firstName,lastName);
 var partialViewModel = new PartialViewModel(model);
 return PartialView(mypartialViewModel); 
}

Example view code:

 <p>
    @model.something
 </p>
 </br>
 <span>
    @model.otherthing
 </span>

OR do all markup in the partial view:

<div>
    <p>
        @model.something
    </p>
    </br>
    <span>@model.otherthing</span>
</div>

Current page:

@foreach(var Document in model)
{
    @{Html.RenderPartial("MyPartialViewName",
        new { firstName = model.FirstName, lastName = model.LastName});
    }
}

Note you can also pass the model part as the Document:

 @foreach(var Document in model)
 {
    @{Html.RenderPartial("MyPartialViewName",Document);
 }

And the partial view: (no parameters passed here...just the model)

@model YourApp.Model.Document
<div>
  <p>
        @Model.Details
   </p>
   </br>
   <span>@Model.File</span>
</div>

Thank you. I will try the above code tomo morning. I hope it works. — user7721524, Apr 07 '17 at 21:38
This code works for calling the partial view directly from inside the div. But i want to call the controller action, which is not happening. — user7721524, Apr 08 '17 at 10:52
I edited the answer (see near the top of example to specify controller - it should call the action named within that controller. It should call that controller, set a debug in it. — Mark Schultheiss, Apr 08 '17 at 15:42

create tabs inside a tab view calling a controller action that returns a partial view

1 Answers1