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

Defines the fluent API for configuring the Telerik UI Drawer for ASP.NET MVC.

Definition

Constructors

Initializes a new instance of the Drawer class.

C#
public DrawerBuilder(Drawer component)
Parameters:componentDrawer

The component.

Methods

Specifies if the Drawer will be automatically collapsed when an item is clicked.

C#
public DrawerBuilder AutoCollapse(bool value)
Parameters:valuebool

The value that configures the collapsed state of the item.

Returns:

DrawerBuilder

Example:
C#
@(Html.Kendo().Drawer()
.Name("drawer")
.AutoCollapse(true)
)

Defines the associated content for the Drawer.

C#
public DrawerBuilder Content(Action value)
Parameters:valueAction

The value for the content.

Returns:

DrawerBuilder

The HTML string representing the associated content for the Drawer.

C#
public DrawerBuilder Content(Func<object, object> value)
Parameters:valueFunc<object, object>

The value wrapped in a text tag.

Returns:

DrawerBuilder

Example:
C#
@(Html.Kendo().Drawer()
.Name("drawer")
.Content(@&lt;text&gt;
&lt;span&gt;Content is here &lt;/span&gt;
&lt;/text&gt;)
)

Sets the HTML content of the Drawer from a partial view.

C#
public DrawerBuilder Content(MvcHtmlString partialView)
Parameters:partialViewMvcHtmlString

The partial view that provides the HTML content.

Returns:

DrawerBuilder

Example:
C#
@(Html.Kendo().Drawer()
.Name("drawer")
.Content(Html.Partial("_DrawerContent"))
)

The HTML string representing the associated content for the Drawer.

C#
public DrawerBuilder Content(string value)
Parameters:valuestring

The value for the content.

Returns:

DrawerBuilder

Example:
C#
@(Html.Kendo().Drawer()
.Name("drawer")
.Content(@"
&lt;span&gt;Content is here &lt;/span&gt;
")
)

Handles the client-side events of the Drawer.

C#
public DrawerBuilder Events(Action<DrawerEventBuilder> configurator)
Parameters:configuratorAction<DrawerEventBuilder>

The action that configures the available events.

Returns:

DrawerBuilder

Example:
C#
@(Html.Kendo().Drawer()
.Name("drawer")
.Events(events =&gt; events.Hide("onHide").Show("onShow"))
)

Specifies if the Drawer will be expanded by default.

C#
public DrawerBuilder Expanded(bool value)
Parameters:valuebool

The value that configures the expanded state of the Drawer.

Returns:

DrawerBuilder

Example:
C#
@(Html.Kendo().Drawer()
.Name("drawer")
.Expanded(true)
)

Specifies the items rendered by the Drawer when the top-level template option is not set. Each item can define text, icon, state, custom attributes, per-item template functions, and nested child items through items.items. If template is configured, it takes precedence and the items configuration is ignored.

C#
public DrawerBuilder Items(Action<DrawerItemFactory> configurator)
Parameters:configuratorAction<DrawerItemFactory>

The action that configures the items.

Returns:

DrawerBuilder

Specifies the minimum height for the Drawer when the "push" mode is enabled. The "overlay" mode takes 100% of the page height.

C#
public DrawerBuilder MinHeight(double value)
Parameters:valuedouble

The value that configures the minimum height.

Returns:

DrawerBuilder

Example:
C#
@(Html.Kendo().Drawer()
.Name("drawer")
.MinHeight(300)
)

Configures the "mini" mode of the Drawer - a compact view that is displayed when the Drawer is collapsed. Usually, it used to show only the icons when the Drawer's item contains icon and text. When it is enabled, it uses the main template.

C#
public DrawerBuilder Mini(Action<DrawerMiniSettingsBuilder> configurator)
Parameters:configuratorAction<DrawerMiniSettingsBuilder>

The action that configures the "mini" mode.

Returns:

DrawerBuilder

Example:
C#
@(Html.Kendo().Drawer()
.Name("drawer")
.Mini(mode =&gt; mode.Width(45))
)

Enables the "mini" mode of the Drawer - a compact view that is displayed when the Drawer is collapsed. Usually, it used to show only the icons when the Drawer's item contains icon and text. When it is enabled, it uses the main template.

C#
public DrawerBuilder Mini(bool enabled)
Parameters:enabledbool

Enables or disables the "mini" mode.

Returns:

DrawerBuilder

Example:
C#
@(Html.Kendo().Drawer()
.Name("drawer")
.Mini(true)
)

Determines how the Drawer will interact with the associated content. The default mode ("overlay") will overlap the respective content with an overlay effect. The "push" mode will show the Drawer next to the content. The associated item will shrink its content.

C#
public DrawerBuilder Mode(string value)
Parameters:valuestring

The value that configures the mode option.

Returns:

DrawerBuilder

Example:
C#
@(Html.Kendo().Drawer()
.Name("drawer")
.Mode("push")
)

Enables the keyboard navigation of the Drawer. By default keyboard navigation is disabled.

C#
public DrawerBuilder Navigatable(bool value)
Parameters:valuebool

The value that enables the keyboard navigation.

Returns:

DrawerBuilder

Example:
C#
@(Html.Kendo().Drawer()
.Name("drawer")
.Navigatable(true)
)

Sets the position of the Drawer. It can be left (default) or right.

C#
public DrawerBuilder Position(string value)
Parameters:valuestring

The value that configures the Drawer position.

Returns:

DrawerBuilder

Example:
C#
@(Html.Kendo().Drawer()
.Name("drawer")
.Position("right")
)

By default, the users must swipe the respective content from an inner part of the view to activate the Drawer. When the option is disabled, swiping the associated content will not activate the Drawer. The Drawer will only be open by calling the show() client-side method. The option must be disabled for browsers that use side-swiping gestures for back/forward navigation, such as iOS Safari.

C#
public DrawerBuilder SwipeToOpen(bool value)
Parameters:valuebool

The value that configures the swipe option.

Returns:

DrawerBuilder

Example:
C#
@(Html.Kendo().Drawer()
.Name("drawer")
.SwipeToOpen(true)
)

Specifies the Drawer's content.

C#
public DrawerBuilder Template(string value)
Parameters:valuestring

The value that configures the template.

Returns:

DrawerBuilder

Example:
C#
@(Html.Kendo().Drawer()
.Name("drawer")
.Template(@"&lt;ul&gt;
&lt;li data-role='drawer-item'&gt;&lt;span class='k-item-text' data-id='item1'&gt;Item 1&lt;/span&gt;&lt;/li&gt;
&lt;li data-role='drawer-item'&gt;&lt;span class='k-item-text' data-id='item2'&gt;Item 2&lt;/span&gt;&lt;/li&gt;&lt;/ul&gt;
")
)

Specifies the Drawer's content.

C#
public DrawerBuilder Template<TModel>(TemplateBuilder<TModel> template)
Parameters:templateTemplateBuilder<TModel>

A Template component that configures the template.

Returns:

DrawerBuilder

Specifies the Drawer's content.

C#
public DrawerBuilder TemplateHandler(string value)
Parameters:valuestring

The value that configures the template.

Returns:

DrawerBuilder

Example:
C#
@(Html.Kendo().Drawer()
.Name("drawer")
.TemplateHandler("drawerTemplate")
)
&lt;script&gt;
function drawerTemplate() {
return `&lt;ul&gt;
&lt;li data-role='drawer-item'&gt;&lt;span class='k-item-text' data-id='item1'&gt;Item 1&lt;/span&gt;&lt;/li&gt;
&lt;li data-role='drawer-item'&gt;&lt;span class='k-item-text' data-id='item2'&gt;Item 2&lt;/span&gt;&lt;/li&gt;&lt;/ul&gt;`;
}
&lt;/script&gt;

Specifies the Drawer's content.

C#
public DrawerBuilder TemplateId(string value)
Parameters:valuestring

The value that configures the template.

Returns:

DrawerBuilder

Example:
C#
@(Html.Kendo().Drawer()
.Name("drawer")
.TemplateId("drawer-template")
)
&lt;script id="drawer-template" type="text/x-kendo-template"&gt;
&lt;ul&gt;
&lt;li data-role='drawer-item'&gt;&lt;span class='k-item-text' data-id='item1'&gt;Item 1&lt;/span&gt;&lt;/li&gt;
&lt;li data-role='drawer-item'&gt;&lt;span class='k-item-text' data-id='item2'&gt;Item 2&lt;/span&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;/script&gt;

Specifies the Drawer's content.

C#
public DrawerBuilder TemplateView(MvcHtmlString value)
Parameters:valueMvcHtmlString

The value that configures the template.

Returns:

DrawerBuilder

Example:
C#
@(Html.Kendo().Drawer()
.Name("drawer")
.TemplateView(Html.Partial("DrawerTemplateView"))
)

Defines a specific width for the Drawer when it is expanded.

C#
public DrawerBuilder Width(double value)
Parameters:valuedouble

The value that configures the width.

Returns:

DrawerBuilder

Example:
C#
@(Html.Kendo().Drawer()
.Name("drawer")
.Width(200)
)