New to Telerik UI for ASP.NET MVC? Download free 30-day trial

SkeletonContainerBuilder

Methods

Grid(System.Action)

Defines the settings for the CSS Grid that creates the skeleton shapes.

Parameters

configurator - System.Action<SkeletonContainerGridSettingsBuilder>

The action that configures the grid settings.

Example


            @(Html.Kendo().SkeletonContainer()
                .Name("skeleton")
                .Grid(grid => {
                    grid.Rows(4);
                    grid.Columns(4);
                    grid.Items(i=> {
                        i.Add().ColStart(1).ColSpan(1).RowStart(1).RowSpan(1).Shape(SkeletonContainerItemShape.Rectangle);
                        i.Add().ColStart(2).ColSpan(1).RowStart(1).RowSpan(1).Shape(SkeletonContainerItemShape.Rectangle);
                    });
                })
            )

Height(System.String)

Determines the height of the component. The numeric values are treated as pixels.

Parameters

value - System.String

The value that configures the height.

Example


            @(Html.Kendo().SkeletonContainer()
                .Name("skeleton")
                .Height("340px")
            )

Template(System.String)

Defines a template that will be used to visualize the skeleton shapes. If both Grid() and Template() options are defined, the Grid takes precedence.

Parameters

value - System.String

The value that configures the template.

Example


            @(Html.Kendo().SkeletonContainer()
                .Name("skeleton")
                .Template("<span>Text</span><span data-shape-text>Text</span>")
            )

TemplateId(System.String)

Defines a template that will be used to visualize the skeleton shapes. If both Grid() and TemplateId() options are defined, the Grid takes precedence.

Parameters

value - System.String

The id of the Kendo UI external template.

Example


            @(Html.Kendo().SkeletonContainer()
                .Name("skeleton")
                .TemplateId("skeletonShapeTemplate")
            )
            <script id="skeletonShapeTemplate" type="text/x-kendo-template">
                <span>Text</span><span data-shape-text>Text</span>
            </script>

TemplateView(System.Web.Mvc.MvcHtmlString)

Defines a template that will be used to visualize the skeleton shapes. If both Grid() and TemplateView() options are defined, the Grid takes precedence.

Parameters

value - System.Web.Mvc.MvcHtmlString

The Razor View that contains the template of the SkeletonContainer.

Example


            @(Html.Kendo().SkeletonContainer()
                .Name("skeleton")
                .TemplateView(Html.Partial("SkeletonTemplateView"))
            )

TemplateHandler(System.String)

Defines a template that will be used to visualize the skeleton shapes. If both Grid() and TemplateHandler() options are defined, the Grid takes precedence.

Parameters

value - System.String

The JavaScript function that will return the template.

Example


            @(Html.Kendo().SkeletonContainer()
                .Name("skeleton")
                .TemplateHandler("skeletonTemplate")
            )
            <script>
               function skeletonTemplate() {
                 return `<span>Text</span><span data-shape-text>Text</span>`;
                }
            </script>

Template(Kendo.Mvc.UI.TemplateBuilder)

Defines a template that will be used to visualize the skeleton shapes. If both Grid() and Template() options are defined, the Grid takes precedence.

Parameters

template - TemplateBuilder<TModel>

A Template component that configures the template.

Example


            @(Html.Kendo().SkeletonContainer()
                .Name("skeleton")
                .Template(Html.Kendo().Template().AddHtml("<span>Text</span><span data-shape-text>Text</span>"))
            )

Width(System.String)

Determines the width of the component. The numeric values are treated as pixels.

Parameters

value - System.String

The value that configures the width.

Example


            @(Html.Kendo().SkeletonContainer()
                .Name("skeleton")
                .Width("200px")
            )

Animation(Kendo.Mvc.UI.SkeletonContainerAnimation)

Determines whether the items will be animated.

Parameters

value - SkeletonContainerAnimation

The enum value that configures the animation.

Example


            @(Html.Kendo().SkeletonContainer()
                .Name("skeleton")
                .Animation(SkeletonContainerAnimation.Pulse)
            )

ToComponent()

Returns the internal view component.

Name(System.String)

Sets the name of the component.

Parameters

componentName - System.String

The name of the component.

Example


            @(Html.Kendo().Grid<OrderViewModel>()
               .Name("grid")
               .Columns(columns =>
               {
                   columns.Bound(p => p.OrderID).Filterable(false);
                   columns.Bound(p => p.Freight);  
               })
               .DataSource(dataSource => dataSource
                   .Ajax()
                   .PageSize(20)
                   .Read(read => read.Action("Orders_Read", "Grid"))
               )
            )

Deferred(System.Boolean)

Suppress initialization script rendering. Note that this options should be used in conjunction with Kendo.Mvc.UI.Fluent.WidgetFactory.DeferredScripts(System.Boolean)

Parameters

deferred - System.Boolean

ModelMetadata(System.Web.Mvc.ModelMetadata)

Uses the Metadata of the Model.

Parameters

modelMetadata - System.Web.Mvc.ModelMetadata

The metadata set for the Model

HtmlAttributes(System.Object)

Sets the HTML attributes.

Parameters

attributes - System.Object

The HTML attributes.

HtmlAttributes(System.Collections.Generic.IDictionary)

Parameters

attributes - System.Collections.Generic.IDictionary<String,Object>

AsChildComponent()

Render()

Renders the component.

Example


            @(@Page Inherits="System.Web.Mvc.ViewPage<IEnumerable<Product>>" )
            @( Html.Kendo().Grid(Model)
                .Name("grid")
                .DetailTemplate(product => {
                    )
                       Product Details:
                       <div>Product Name: @( product.ProductName )</div>
                       <div>Units In Stock: @( product.UnitsInStock )</div>
                    @(
                })
                .Render();
            )

ToHtmlString()

ToClientTemplate()

In this article
Not finding the help you need?