handler String(default: null)

Selector that determines which element will be used as a draggable handler. If a handler is defined, the user will be able to move the Sortable items only if the cursor/finger is positioned onto the handler element.

Example - Sortable widget with drag handlers

<ul id="sortable">
    <li><span class="handler"></span>ItemA1</li>
    <li><span class="handler"></span>ItemA2</li>
    <li><span class="handler"></span>ItemA3</li>
</ul>

<script>
    $("#sortable").kendoSortable({
        handler: ".handler"
    });
</script>

<style>
    .handler {
        width: 16px;
        height: 16px;
        background-color: #FF0000;
        display: inline-block;
    }
</style>
In this article