javascriptc#jquerykendo-uikendo-tabstrip

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


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

Solution

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