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

SortableBuilder

Methods

For(System.String)

The selector to match the DOM element to which the Sortable component will be instantiated

Parameters

selector - System.String

jQuery selector

Example


            @(Html.Kendo().Sortable()
                   .For("#element")
            )

Disabled(System.String)

The selector that determines which items are disabled. Disabled items cannot be dragged but are valid sort targets.

Parameters

selector - System.String

jQuery selector

Example


            @(Html.Kendo().Sortable()
                   .For("#element")
                   .Disabled("#element2")
            )

Filter(System.String)

The selector that determines which items are sortable. Filtered items cannot be dragged and are not valid sort targets.

Parameters

selector - System.String

jQuery selector

Example


            @(Html.Kendo().Sortable()
                   .For("#element")
                   .Filter("#element2")
            )

Handler(System.String)

The selector that determines which element will be used as a draggable handler.

Parameters

selector - System.String

jQuery selector

Example


            @(Html.Kendo().Sortable()
                   .For("#element")
                   .Handler("#element2")
            )

ContainerSelector(System.String)

Selector that determines the container boundaries in which hint movement will be constrained to.

Parameters

selector - System.String

jQuery selector

Example


            @(Html.Kendo().Sortable()
                   .For("#element")
                   .ContainerSelector("#element2")
            )

ConnectWith(System.String)

The selector which determines if items from the current Sortable component can be accepted from another Sortable container(s). The connectWith option describes one way relationship, if the developer wants a two way connection then the connectWith option should be set on both components.

Parameters

selector - System.String

jQuery selector

Example


            @(Html.Kendo().Sortable()
                   .For("#element")
                   .ConnectWith("#element2")
            )

Ignore(System.String)

The selector which determines child elements for which the sort will not be initiated. Useful if the sortable item contains input elements.

Parameters

selector - System.String

jQuery selector

Example


            @(Html.Kendo().Sortable()
                   .For("#element")
                   .Ignore("#element2")
            )

Cursor(System.String)

The CSS style which determines the cursor that will be shown while user drags sortable item. For example 'move', 'pointer', etc.

Parameters

cursor - System.String

String

Example


            @(Html.Kendo().Sortable()
                   .For("#element")
                   .Cursor("pointer")
            )

HoldToDrag(System.Boolean)

When set to true, the item will be activated after the user taps and holds the finger on the element for a short amount of time.

Parameters

value - System.Boolean

Example


            @(Html.Kendo().Sortable()
                   .For("#element")
                   .HoldToDrag(true)
            )

AutoScroll(System.Boolean)

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

Parameters

value - System.Boolean

Example


            @(Html.Kendo().Sortable()
                   .For("#element")
                   .AutoScroll(true)
            )

Axis(Kendo.Mvc.UI.SortableAxis)

Constrains the hint movement to either the horizontal (x) or vertical (y) axis.

Parameters

axis - SortableAxis

The axis

Example


            @(Html.Kendo().Sortable()
                   .For("#element")
                   .Axis(SortableAxis.Y)
            )

CursorOffset(System.Action)

Configures the cursor offset of Sortable component.

Parameters

cursorOffsetSettingsAction - System.Action<SortableCursorOffsetSettingsBuilder>

Cursor offset settings action.

Example


            @(Html.Kendo().Sortable()
                   .For("#element")
                   .CursorOffset(co => co.Top(12))
            )

Hint(System.String)

HTML string representing the the hint element

Parameters

content - System.String

Html string

Example


            @(Html.Kendo().Sortable()
                   .For("#element")
                   .Hint("content")
            )

HintHandler(System.Func)

Sets JavaScript function which to return the hint for the sorted item.

Parameters

handler - System.Func<Object,Object>

The handler code wrapped in a text tag (Razor syntax).

Example


            @(Html.Kendo().Sortable()
                   .For("#element")
                   .HintHandler(@<text>
                            function(e) {
                                //event handling code
                            }
                            </text>
                       )
            )

HintHandler(System.String)

Sets JavaScript function which to return the hint for the sorted item.

Parameters

handler - System.String

JavaScript function name

Example


            @(Html.Kendo().Sortable()
                   .For("#element")
                   .HintHandler("handler")
            )

Placeholder(System.String)

HTML string representing the placeholder

Parameters

content - System.String

Html string

Example


            @(Html.Kendo().Sortable()
                   .For("#element")
                   .Placeholder("content")
            )

PlaceholderHandler(System.Func)

Sets JavaScript function which to return the placeholder for the sorted item.

Parameters

handler - System.Func<Object,Object>

The handler code wrapped in a text tag (Razor syntax).

Example


            @(Html.Kendo().Sortable()
                   .For("#element")
                   .PlaceholderHandler(@<text>
                            function(e) {
                                //event handling code
                            }
                            </text>
                       )
            )

PlaceholderHandler(System.String)

Sets JavaScript function which to return the placeholder for the sorted item.

Parameters

handler - System.String

JavaScript function name

Example


            @(Html.Kendo().Sortable()
                   .For("#element")
                   .PlaceholderHandler("handler")
            )

Deferred()

Suppress initialization script rendering. Note that this options should be used in conjunction with

ToComponent()

Returns the internal view component.

Events(System.Action)

Sets the event configuration of the Sortable.

Parameters

configurator - System.Action<SortableEventBuilder>

The lambda which configures the events

Example


            @(Html.Kendo().Sortable()
                        .For("#element")
                        .Events(events => events.Start("start"))
            )

Render()

Renders the component.

ToHtmlString()

ToClientTemplate()

In this article
Not finding the help you need?