how to use render partial in a kendo ui tab strip

Question

How can I do a tab strip in kendo ui with render partial...

This is what I have been trying

@(Html.Kendo().TabStrip()
          .Name("tabstrip")
          .Items(tabstrip =>
          {
              tabstrip.Add().Text("COES Details")
                  .Selected(true)
                  .Content(@<text>
                    @{Html.RenderPartial("ViewCOESDetails", @Model.COESDetails);}
                  </text>);

              tabstrip.Add().Text("New York")
                  .Content(@<text>
                    <div class="weather">
                        <h2>29<span>&ordm;C</span></h2>
                        <p>Sunny weather in New York.</p>
                    </div>
                    <span class="sunny">&nbsp;</span>
                  </text>);

              tabstrip.Add().Text("Moscow")
                  .Content(@<text>
                    <div class="weather">
                        <h2>16<span>&ordm;C</span></h2>
                        <p>Cloudy weather in Moscow.</p>
                    </div>
                    <span class="cloudy">&nbsp;</span>
                  </text>);

              tabstrip.Add().Text("Sydney")
                  .Content(@<text>
                    <div class="weather">
                        <h2>17<span>&ordm;C</span></h2>
                        <p>Rainy weather in Sidney.</p>
                    </div>
                    <span class="rainy">&nbsp;</span>
                  </text>);
          })
    )

It just shows the page on the outside of the tab... what is the correct syntax...

any ideas?

Thanks

Answer 1

tabstrip.Add().Text("COES Details").Enabled(true) .Content(@Html.Partial("path of the Partialview", Model).ToHtmlString());