TreeViewBuilder

Methods

AutoBind(System.Boolean)

Controls whether to bind the widget to the DataSource on initialization.

Parameters

autoBind - System.Boolean

Example

Razor
 
             @( Html.Kendo().TreeView()
                        .Name("TreeView")
                        .AutoBind(false)
            )
             

CheckboxTemplate(System.String)

Defines the template that renders the checkboxes in the TreeView. The available fields in the template are: - item: The data item of the given node. - treeview: The TreeView options.

Parameters

template - System.String

The value that configures the checkbox template.

Example

Razor
 
             @(Html.Kendo().TreeView()
                        .Name("TreeView")
                        .Checkboxes(checkboxes => checkboxes
                            .Name("checkedFiles")
                            .CheckChildren(true)
                        )
                        .CheckboxTemplate("<input type='checkbox' name='checkedFiles[#= item.id #]' value='true' />")
             )
             

CheckboxTemplateId(System.String)

Defines the template that renders the checkboxes in the TreeView. The available fields in the template are: - item: The data item of the given node. - treeview: The TreeView options.

Parameters

templateId - System.String

The "id" attribute of the external Kendo UI Template.

Example

Razor
 
             @(Html.Kendo().TreeView()
                        .Name("TreeView")
                        .Checkboxes(checkboxes => checkboxes
                            .Name("checkedFiles")
                            .CheckChildren(true)
                        )
                        .CheckboxTemplateId("checkBoxTemplate")
             )
            <script id="checkBoxTemplate" type="text/x-kendo-template">
                <input type='checkbox' name='checkedFiles[#= item.id #]' value='true' />
            </script>
             

CheckboxTemplateView(System.Web.Mvc.MvcHtmlString)

Defines the template that renders the checkboxes in the TreeView. The available fields in the template are: - item: The data item of the given node. - treeview: The TreeView options.

Parameters

template - System.Web.Mvc.MvcHtmlString

The Razor View that contains the checkbox template.

Example

Razor
 
             @(Html.Kendo().TreeView()
                        .Name("TreeView")
                        .Checkboxes(checkboxes => checkboxes
                            .Name("checkedFiles")
                            .CheckChildren(true)
                        )
                        .CheckboxTemplateView(Html.Partial("TemplateView"))
             )
             

CheckboxTemplateHandler(System.String)

Defines the template that renders the checkboxes in the TreeView. The available fields in the template are: - item: The data item of the given node. - treeview: The TreeView options.

Parameters

template - System.String

The JavaScript function that will return the checkbox template.

Example

Razor
 
             @(Html.Kendo().TreeView()
                        .Name("TreeView")
                        .Checkboxes(checkboxes => checkboxes
                            .Name("checkedFiles")
                            .CheckChildren(true)
                        )
                        .CheckboxTemplateHandler("getCheckBoxTemplate")
             )
            <script>
                function getCheckBoxTemplate(data) {
                    return `<input type='checkbox' name='checkedFiles[${data.item.id}]' value='true' />`;
                }
            </script>
             

CheckboxTemplate(Kendo.Mvc.UI.TemplateBuilder)

Defines the template that renders the checkboxes in the TreeView. The available fields in the template are: - item: The data item of the given node. - treeview: The TreeView options.

Parameters

template - TemplateBuilder<TModel>

A Template component that configures the checkbox template.

Example

Razor
 
             @(Html.Kendo().TreeView()
                        .Name("TreeView")
                        .Checkboxes(checkboxes => checkboxes
                            .Name("checkedFiles")
                            .CheckChildren(true)
                        )
                        .CheckboxTemplate(Html.Kendo().Template().AddHtml("<input type='checkbox' name='checkedFiles[${data.item.id}]' value='true' />"))
             )
             

Template(System.String)

Defines the template for rendering each TreeView node.

Parameters

template - System.String

The value that configures the node template.

Example

Razor
 
             @( Html.Kendo().TreeView()
                        .Name("TreeView")
                        .Template("<span>#= item.text #</span>")
            )
             

TemplateId(System.String)

Defines the template for rendering each TreeView node.

Parameters

templateId - System.String

The "id" attribute of the external Kendo UI Template.

Example

Razor
 
             @( Html.Kendo().TreeView()
                        .Name("TreeView")
                        .TemplateId("nodeTemplate")
            )
            <script id="nodeTemplate" type="text/x-kendo-template">
                <span>#= item.text #</span>
            </script>
             

TemplateView(System.Web.Mvc.MvcHtmlString)

Defines the template for rendering each TreeView node.

Parameters

template - System.Web.Mvc.MvcHtmlString

The Razor View that contains the node template.

Example

Razor
 
             @( Html.Kendo().TreeView()
                        .Name("TreeView")
                        .TemplateView(Html.Partial("TemplateView"))
            )
             

TemplateHandler(System.String)

Defines the template for rendering each TreeView node.

Parameters

template - System.String

The JavaScript function that will return the template content.

Example

Razor
 
             @(Html.Kendo().TreeView()
                        .Name("TreeView")
                        .TemplateHandler("getNodeTemplate")
             )
            <script>
                function getNodeTemplate(data) {
                    return `<span>${data.item.text}</span>`;
                }
            </script>
             

Template(Kendo.Mvc.UI.TemplateBuilder)

Defines the template for rendering each TreeView node.

Parameters

template - TemplateBuilder<TModel>

A Template component that configures the node template.

Example

Razor
 
             @(Html.Kendo().TreeView()
                        .Name("TreeView")
                        .Template(Html.Kendo().Template().AddHtml("<span>${data.item.text}</span>"))
             )
             

Checkboxes(System.Boolean)

Enables or disables the rendering of the checkboxes in the TreeView.

Parameters

enabled - System.Boolean

A boolean value that toggles the rendering of the checkboxes.

Example

Razor
 
             @( Html.Kendo().TreeView()
                        .Name("TreeView")
                        .Checkboxes(true)
            )
             

Checkboxes(System.Action)

Configures the rendering of the checkboxes in the TreeView.

Parameters

configure - System.Action<TreeViewCheckboxesBuilder>

The action that configures the checkboxes settings.

Example

Razor
 
             @( Html.Kendo().TreeView()
                        .Name("TreeView")
                        .Checkboxes(config => config
                            .CheckChildren(true)
                        )
            )
             

Items(System.Action)

Defines the items in the TreeView

Parameters

addAction - System.Action<TreeViewItemFactory>

The add action.

Example

Razor
 
             @( Html.Kendo().TreeView()
                        .Name("TreeView")
                        .Items(items =>
                        {
                            items.Add().Text("First Item");
                            items.Add().Text("Second Item");
                        })
            )
             

Events(System.Action)

Configures the client-side events.

Parameters

clientEventsAction - System.Action<TreeViewEventBuilder>

The client events action.

Example

Razor
 
             @( Html.Kendo().TreeView()
                        .Name("TreeView")
                        .Events(events =>
                            .OnDataBinding("onDataBinding")
                            .OnItemDataBound("onItemDataBound")
                        )
            )
             

BindTo(System.String,System.Action)

Binds the TreeView to a sitemap

Parameters

viewDataKey - System.String

The view data key.

siteMapAction - System.Action<TreeViewItem,SiteMapNode>

The action to configure the item.

Example

Razor
 
             @( Html.Kendo().TreeView()
                        .Name("TreeView")
                        .BindTo("examples", (item, siteMapNode) =>
                        {
                        })
            )
             

BindTo(System.String)

Binds the TreeView to a sitemap.

Parameters

viewDataKey - System.String

The view data key.

Example

Razor
 
             @( Html.Kendo().TreeView()
                        .Name("TreeView")
                        .BindTo("examples")
            )
             

BindTo(System.Collections.Generic.IEnumerable)

Binds the TreeView to a list of items. Use if a hierarchy of items is being sent from the controller; to bind the TreeView declaratively, use the Items() method.

Parameters

items - System.Collections.Generic.IEnumerable<TreeViewItemModel>

The list of items

Example

Razor
 
             @( Html.Kendo().TreeView()
                        .Name("TreeView")
                        .BindTo(model)
            )
             

BindTo(System.Collections.Generic.IEnumerable,System.Action)

Binds the TreeView to a list of objects. The TreeView will be "flat" which means a TreeView item will be created for every item in the data source.

Parameters

dataSource - System.Collections.Generic.IEnumerable<T>

The data source.

itemDataBound - System.Action<TreeViewItem,T>

The action executed for every data bound item.

Example

Razor
 
             @( Html.Kendo().TreeView()
                        .Name("TreeView")
                        .BindTo(new []{"First", "Second"}, (item, value) =>
                        {
                           item.Text = value;
                        })
            )
             

BindTo(System.Collections.IEnumerable,System.Action)

Binds the TreeView to a list of objects. The TreeView will create a hierarchy of items using the specified mappings.

Parameters

dataSource - System.Collections.IEnumerable

The data source.

factoryAction - System.Action<NavigationBindingFactory>

The action which will configure the mappings

Example

Razor
 
             @( Html.Kendo().TreeView()
                        .Name("TreeView")
                        .BindTo(Model, mapping => mapping
                                .For<Customer>(binding => binding
                                    .Children(c => c.Orders) // The "child" items will be bound to the the "Orders" property
                                    .ItemDataBound((item, c) => item.Text = c.ContactName) // Map "Customer" properties to TreeViewItem properties
                                )
                                .For<Order<(binding => binding
                                    .Children(o => null) // "Orders" do not have child objects so return "null"
                                    .ItemDataBound((item, o) => item.Text = o.OrderID.ToString()) // Map "Order" properties to TreeViewItem properties
                                )
                        )
            )
             

ItemAction(System.Action)

Callback for each item.

Parameters

action - System.Action<TreeViewItem>

Action, which will be executed for each item.

Example

Razor
 
             @( Html.Kendo().TreeView()
                        .Name("TreeView")
                        .ItemAction(item =>
                        {
                            item
                                .Text(...)
                                .HtmlAttributes(...);
                        })
            )
             

HighlightPath(System.Boolean)

Select item depending on the current URL.

Parameters

value - System.Boolean

If true the item will be highlighted.

Example

Razor
 
             @( Html.Kendo().TreeView()
                        .Name("TreeView")
                        .HighlightPath(true)
            )
             

Animation(System.Boolean)

Use to enable or disable animation of the TreeView.

Parameters

enable - System.Boolean

The boolean value.

Example

Razor
 
            @( Html.Kendo().TreeView()
                       .Name("TreeView")
                       .Animation(false) //toggle effect
            )
             

Animation(System.Action)

Configures the animation effects of the widget.

Parameters

animationAction - System.Action<ExpandableAnimationBuilder>

The action which configures the animation effects.

Example

Razor
 
            @( Html.Kendo().TreeView()
                       .Name("TreeView")
                       .Animation(animation =>
                       {
            	            animation.Expand(open =>
            	            {
            	                open.SlideIn(SlideDirection.Down);
            	            });
                       })
            )
             

ExpandAll(System.Boolean)

Expand all the items.

Parameters

value - System.Boolean

If true all the items will be expanded.

Example

Razor
 
             @( Html.Kendo().TreeView()
                        .Name("TreeView")
                        .ExpandAll(true)
            )
             

DragAndDrop(System.Boolean)

Disables (false) or enables (true) drag-and-drop of the nodes. If configured as an object allows disabling click move click interaction as an alternative of dragging.

Parameters

value - System.Boolean

If true, drag & drop is enabled.

Example

Razor
 
             @( Html.Kendo().TreeView()
                        .Name("TreeView")
                        .Items(items =>
                        {
                            items.Add().Text("First Item");
                            items.Add().Text("Second Item");
                        })
                        .DragAndDrop(true)
            )
             

DragAndDrop(System.Action)

Allows disabling click move click interaction as an alternative of dragging. Disables (false) or enables (true) the click move click interaction as an alternative of dragging. The alternative is disabled by default.

Parameters

configure - System.Action<TreeViewDragAndDropBuilder>

Builder of the treeview drag & drop configuration.

Example

Razor
 
             @( Html.Kendo().TreeView()
                        .Name("TreeView")
                        .DragAndDrop(config => config
                            .ClickMoveClick(true)
                        )
            )
             

SecurityTrimming(System.Boolean)

Enable/disable security trimming functionality of the component.

Parameters

value - System.Boolean

If true security trimming is enabled.

Example

Razor
 
             @( Html.Kendo().TreeView()
                        .Name("TreeView")
                        .SecurityTrimming(false)
            )
             

SecurityTrimming(System.Action)

Defines the security trimming functionality of the component

Parameters

securityTrimmingAction - System.Action<SecurityTrimmingBuilder>

The securityTrimming action.

Example

Razor
 
             @( Html.Kendo().TreeView()
                        .Name("TreeView")
                        .SecurityTrimming(builder =>
                        {
                            builder.Enabled(true).HideParent(true);
                        })
            )
             

DataSource(System.Action)

Configure the DataSource of the component

Parameters

configurator - System.Action<HierarchicalDataSourceBuilder>

The action that configures the DataSource.

Example

Razor
 
             @( Html.Kendo().TreeView()
                .Name("TreeView")
                .DataSource(dataSource => dataSource
                    .Read(read => read
                        .Action("Employees", "TreeView")
                    )
                )
             )
             

DataSource(System.String)

Parameters

dataSourceId - System.String

LoadOnDemand(System.Boolean)

Allows the treeview to fetch the entire datasource at initialization time.

Parameters

value - System.Boolean

Whether the datasource should be loaded on demand.

Example

Razor
 
             @( Html.Kendo().TreeView()
                        .Name("TreeView")
                        .LoadOnDemand(false)
            )
             

AutoScroll(System.Boolean)

If set to true the widget will auto-scroll the containing element when the mouse/finger is close to the top/bottom of it.

Parameters

value - System.Boolean

The value that configures the autoscroll.

Example

Razor
 
             @( Html.Kendo().TreeView()
                        .Name("treeview")
                        .AutoScroll(true)
            )
             

DataImageUrlField(System.String)

Sets the field of the data item that provides the image URL of the TreeView nodes.

Parameters

value - System.String

The value that configures the dataimageurlfield.

Example

Razor
 
             @( Html.Kendo().TreeView()
                        .Name("treeview")
                        .DataImageUrlField("ImageUrl")
            )
             

DataSpriteCssClassField(System.String)

Sets the field of the data item that provides the sprite CSS class of the nodes. If an array, each level uses the field that is at the same index in the array, or the last item in the array.

Parameters

value - System.String

The value that configures the dataspritecssclassfield.

Example

Razor
 
             @( Html.Kendo().TreeView()
                        .Name("treeview")
                        .DataSpriteCssClassField("SpriteCssClass")
            )
             

DataUrlField(System.String)

Sets the field of the data item that provides the link URL of the nodes.

Parameters

value - System.String

The value that configures the dataurlfield.

Example

Razor
 
             @( Html.Kendo().TreeView()
                        .Name("treeview")
                        .DataUrlField("DataUrlField")
            )
             

Messages(System.Action)

The text messages displayed in the widget. Use it to customize or localize the messages.

Parameters

configurator - System.Action<TreeViewMessagesSettingsBuilder>

The action that configures the messages.

Example

Razor
 
             @( Html.Kendo().TreeView()
                        .Name("treeview")
                        .Messages(m => m.Loading("Root items are loading"))
            )
             

Size(Kendo.Mvc.UI.ComponentSize)

Sets the size of the component.

Parameters

value - ComponentSize

The value that configures the size.

Example

Razor
 
             @( Html.Kendo().TreeView()
                        .Name("treeview")
                        .Size(ComponentSize.Medium)
            )
             

DataTextField(System.String[])

Sets the field of the data item that provides the text content of the nodes. If an array, each level uses the field that is at the same index in the array, or the last item in the array.

Parameters

value - System.String[]

The value that configures the datatextfield.

Example

Razor
 
             @( Html.Kendo().TreeView()
                        .Name("treeview")
                        .DataTextField(new string[] { "CategoryName", "ProductName"})
            )
             

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

Razor
 
            @(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

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>

AsModule(System.Boolean)

Specifies whether the initialization script of the component will be rendered as a JavaScript module.

Parameters

value - System.Boolean

Render()

Renders the component.

Example

Razor
 
            @(@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();
            )
             

ScriptAttributes(System.Object,System.Boolean)

Sets the JavaScript attributes to the initialization script.

Parameters

attributes - System.Object

The JavaScript attributes.

overrideAttributes - System.Boolean

Argument which determines whether attributes should be overriden.

ScriptAttributes(System.Collections.Generic.IDictionary,System.Boolean)

Sets the JavaScript attributes to the initialization script.

Parameters

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

The JavaScript attributes.

overrideAttributes - System.Boolean

Argument which determines whether attributes should be overriden.

ToHtmlString()

ToClientTemplate()

In this article
MethodsAutoBind(System.Boolean)CheckboxTemplate(System.String)CheckboxTemplateId(System.String)CheckboxTemplateView(System.Web.Mvc.MvcHtmlString)CheckboxTemplateHandler(System.String)CheckboxTemplate(Kendo.Mvc.UI.TemplateBuilder)Template(System.String)TemplateId(System.String)TemplateView(System.Web.Mvc.MvcHtmlString)TemplateHandler(System.String)Template(Kendo.Mvc.UI.TemplateBuilder)Checkboxes(System.Boolean)Checkboxes(System.Action)Items(System.Action)Events(System.Action)BindTo(System.String,System.Action)BindTo(System.String)BindTo(System.Collections.Generic.IEnumerable)BindTo(System.Collections.Generic.IEnumerable,System.Action)BindTo(System.Collections.IEnumerable,System.Action)ItemAction(System.Action)HighlightPath(System.Boolean)Animation(System.Boolean)Animation(System.Action)ExpandAll(System.Boolean)DragAndDrop(System.Boolean)DragAndDrop(System.Action)SecurityTrimming(System.Boolean)SecurityTrimming(System.Action)DataSource(System.Action)DataSource(System.String)LoadOnDemand(System.Boolean)AutoScroll(System.Boolean)DataImageUrlField(System.String)DataSpriteCssClassField(System.String)DataUrlField(System.String)Messages(System.Action)Size(Kendo.Mvc.UI.ComponentSize)DataTextField(System.String[])ToComponent()Name(System.String)Deferred(System.Boolean)ModelMetadata(System.Web.Mvc.ModelMetadata)HtmlAttributes(System.Object)HtmlAttributes(System.Collections.Generic.IDictionary)AsModule(System.Boolean)Render()ScriptAttributes(System.Object,System.Boolean)ScriptAttributes(System.Collections.Generic.IDictionary,System.Boolean)ToHtmlString()ToClientTemplate()
Not finding the help you need?
Contact Support