Nesting controls in a tab strip

[Scott]

Can you nest Grid controls inside a tab strip?  Is so, is there an example?

[Matthew]

You can, but it messes up the style something fierce. I just cannot see to get it to work, even a simple grid inside a tabstrip ends up having zero width and no column attributes applied =(

[AWL]

I found a work around for this. You have to use a js initialized tabstrip. If you try to nest the grid HTML helper inside the .content attribute of the Tabstrip HTML helper, the initialization methods conflict and the tabs don't function.

<div id="Tabs">

           <ul>

               <li class="k-state-active">Tab One</li>

               <li>Tab Two</li>

           </ul>

           <div>

               @(Html.Kendo().Grid(IEnumerable<Model> models))

           </div>

           <div>

               @(Html.Kendo().Grid(IEnumerable<Model> models))

           </div>

       </div>

 

<script type="text/javascript">

 

         

        $("#Tabs").kendoTabStrip({

            animation:  {

                open: {

                    effects: "fadeIn"

                }

            }  

        });

</script>

Slightly obnoxious, but it works just fine.

Slightly more obnoxious, but it works just fine.