@progress/kendo-treelist-vue-wrapper/docs/editing.md

Kendo UI TreeList wrapper for Vue.js

---
title: Editing
page_title: Editing - TreeList - Kendo UI for Vue
description: "Get started with the editing functionality of the Kendo UI TreeList wrapper in Vue projects."
slug: editing_treelist_wrapper
canonicalLink: "https://www.telerik.com/kendo-vue-ui/components/treelist/"
position: 2
---

<div><WrapperBanner link="/kendo-vue-ui/components/treelist"></WrapperBanner></div> 

# Editing

The Kendo UI TreeList enables you to modify its records.

The available editing options are:

* [Inline editing](#toc-inline-mode)
* [Popup editing](#toc-popup-mode)

You can also rearrange TreeList items by [dragging and dropping]({% slug drag_and_drop_treelist_wrapper %}).

## Inline Mode

The following example demonstrates how to edit data in the default `inline` editing mode.

{% meta height:630 %}
{% embed_file editing/inline/main.vue preview %}
{% embed_file editing/inline/main.js %}
{% endmeta %}

## Popup Mode

The following example demonstrates how to edit data in the `pop-up` editing mode.

{% meta height:630 %}
{% embed_file editing/popup/main.vue preview %}
{% embed_file editing/popup/main.js %}
{% endmeta %}



## Suggested Links

* [Kendo UI TreeList for jQuery](https://docs.telerik.com/kendo-ui/controls/data-management/treelist/overview)
* [API Reference of the TreeList Widget](https://docs.telerik.com/kendo-ui/api/javascript/ui/treelist)