diff --git a/knowledge-base/gantt-persist-treelist-width-after-refresh.md b/knowledge-base/gantt-persist-treelist-width-after-refresh.md
new file mode 100644
index 000000000..e0531f310
--- /dev/null
+++ b/knowledge-base/gantt-persist-treelist-width-after-refresh.md
@@ -0,0 +1,213 @@
+---
+title: Persist Gantt TreeList after Refresh
+description: How to persist the width of the Gantt's treelist after refreshing its data?
+type: how-to
+page_title: How to Display Model Fields in the Gantt Tooltip?
+slug: gantt-kb-persist-treelist-width-after-refresh
+tags: gantt, blazor, treelist, width, persist
+res_type: kb
+ticketid: 1690467
+---
+
+## Environment
+
+
+
+ | Product |
+ Gantt for Blazor |
+
+
+
+
+## Description
+
+If I resize the TreeList part of the Gantt, it gets back to its initial width, after I refresh the Gantt's data. How can I persist the current TreeList width?
+
+## Solution
+
+To persist the current TreeList width, follow the steps below:
+
+1. Bind the `TreeListWidth` parameter of the Gantt to a property. In the example below, the property is named `ListWidth`.
+2. In the methods that manipulate the data of the Gantt (`AddRootTask` and `RemoveTask`), use JavaScript interop to invoke a function. The logic in the function gets and returns the current width of the TreeList.
+3. Use the current width value to update the value of the `ListWidth` property, before refreshing the data by calling `.Rebind()`.
+
+````RAZOR
+@inject IJSRuntime JS
+
+Add root task
+
+Remove Task 1
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+@code {
+ private TelerikGantt GanttRef;
+ private string ListWidth { get; set; } = "390px";
+
+ private List GanttData { get; set; }
+
+ private GanttView SelectedView { get; set; } = GanttView.Week;
+
+ private async Task AddRootTask()
+ {
+ var i = GanttData.Last().Id + 1;
+
+ GanttData.Insert(0, new FlatModel()
+ {
+ Id = i,
+ ParentId = null,
+ Title = "new task",
+ PercentComplete = 0,
+ Start = new DateTime(2021, 7, 5),
+ End = new DateTime(2021, 7, 15)
+ });
+
+ var currentListWidth = await JS.InvokeAsync("getListSize");
+ ListWidth = currentListWidth;
+
+ GanttRef.Rebind();
+ }
+
+ private async Task RemoveTask()
+ {
+ var taskToRemove = GanttData.FirstOrDefault(x => x.Title == "Task 1");
+
+ GanttData.Remove(taskToRemove);
+
+ var currentListWidth = await JS.InvokeAsync("getListSize");
+ ListWidth = currentListWidth;
+
+ GanttRef.Rebind();
+ }
+
+ class FlatModel
+ {
+ public int Id { get; set; }
+ public int? ParentId { get; set; }
+ public string Title { get; set; }
+ public double PercentComplete { get; set; }
+ public DateTime Start { get; set; }
+ public DateTime End { get; set; }
+ }
+
+ private int LastId { get; set; } = 1;
+
+ protected override void OnInitialized()
+ {
+ GanttData = new List();
+ var random = new Random();
+
+ for (int i = 1; i < 6; i++)
+ {
+ var newItem = new FlatModel()
+ {
+ Id = LastId,
+ Title = "Task " + i.ToString(),
+ Start = new DateTime(2021, 7, 5 + i),
+ End = new DateTime(2021, 7, 11 + i),
+ PercentComplete = Math.Round(random.NextDouble(), 2)
+ };
+
+ GanttData.Add(newItem);
+ var parentId = LastId;
+ LastId++;
+
+ for (int j = 0; j < 5; j++)
+ {
+ GanttData.Add(new FlatModel()
+ {
+ Id = LastId,
+ ParentId = parentId,
+ Title = " Task " + i + " : " + j.ToString(),
+ Start = new DateTime(2021, 7, 5 + j),
+ End = new DateTime(2021, 7, 6 + i + j),
+ PercentComplete = Math.Round(random.NextDouble(), 2)
+ });
+
+ LastId++;
+ }
+ }
+
+ base.OnInitialized();
+ }
+
+ private void UpdateItem(GanttUpdateEventArgs args)
+ {
+ var item = args.Item as FlatModel;
+
+ var foundItem = GanttData.FirstOrDefault(i => i.Id.Equals(item.Id));
+
+ if (foundItem != null)
+ {
+ foundItem.Title = item.Title;
+ foundItem.Start = item.Start;
+ foundItem.End = item.End;
+ foundItem.PercentComplete = item.PercentComplete;
+ }
+ }
+
+ private void DeleteItem(GanttDeleteEventArgs args)
+ {
+ var item = GanttData.FirstOrDefault(i => i.Id.Equals((args.Item as FlatModel).Id));
+
+ RemoveChildRecursive(item);
+ }
+
+ private void RemoveChildRecursive(FlatModel item)
+ {
+ var children = GanttData.Where(i => item.Id.Equals(i.ParentId)).ToList();
+
+ foreach (var child in children)
+ {
+ RemoveChildRecursive(child);
+ }
+
+ GanttData.Remove(item);
+ }
+}
+````
+
+## See Also
+
+- [Gantt Overview - Telerik UI for Blazor](slug:gantt-overview)