columns.draggable Boolean (default: false)

If set to true a draghandle will be rendered and the user could reorder the rows by dragging the row via the drag handle.

Note that the reordering operation is only a client-side operation and it does not reflect the order of any data that is bound to the server.

Example

  <div id="treelist"></div>
  <script>
    var service = "https://demos.telerik.com/kendo-ui/service";

    $("#treelist").kendoTreeList({
      dataSource: {
        transport: {
          read: {
            url: service + "/EmployeeDirectory/All",
            dataType: "jsonp"
          }
        },
        schema: {
          model: {
            id: "EmployeeID",
            parentId: "ReportsTo",
            fields: {
              ReportsTo: { field: "ReportsTo",  nullable: true },
              EmployeeID: { field: "EmployeeId", type: "number" },
              Extension: { field: "Extension", type: "number" }
            },
            expanded: true
          }
        }
      },
      height: 540,
      editable: {
        move: {
          reorderable: true
        }
      },
      columns: [
        { draggable: true, width: "40px" },
        { field: "FirstName", title: "First Name", width: 220 },
        { field: "LastName", title: "Last Name", width: 160 },
        { field: "Position" }
      ]
    });
  </script>
In this article