From c3c4f1b735008c59a2b6ede8d03d619db3098b0b Mon Sep 17 00:00:00 2001 From: Nithya Date: Mon, 8 Dec 2025 11:23:54 +0530 Subject: [PATCH 1/7] 997057: UG Documentation for frozen column --- .../columns/freezeColumn/freezeColumn.cs | 173 ++++++++++++++++++ .../gantt/columns/freezeColumn/razor | 21 +++ .../gantt/columns/freezeColumn/tagHelper | 24 +++ .../freezeDirection/freezeDirection.cs | 69 +++++++ .../gantt/columns/freezeDirection/razor | 13 ++ .../gantt/columns/freezeDirection/tagHelper | 27 +++ .../columns/frozenColumn/frozenColumn.cs | 43 +++++ .../gantt/columns/frozenColumn/razor | 12 ++ .../gantt/columns/frozenColumn/tagHelper | 33 ++++ .../frozenLineColor/frozenLineColor.cs | 43 +++++ .../gantt/columns/frozenLineColor/razor | 29 +++ .../gantt/columns/frozenLineColor/tagHelper | 51 ++++++ .../gantt/columns/frozen-column.md | 170 +++++++++++++++++ ej2-asp-core-toc.html | 1 + ej2-asp-mvc-toc.html | 1 + 15 files changed, 710 insertions(+) create mode 100644 ej2-asp-core-mvc/code-snippet/gantt/columns/freezeColumn/freezeColumn.cs create mode 100644 ej2-asp-core-mvc/code-snippet/gantt/columns/freezeColumn/razor create mode 100644 ej2-asp-core-mvc/code-snippet/gantt/columns/freezeColumn/tagHelper create mode 100644 ej2-asp-core-mvc/code-snippet/gantt/columns/freezeDirection/freezeDirection.cs create mode 100644 ej2-asp-core-mvc/code-snippet/gantt/columns/freezeDirection/razor create mode 100644 ej2-asp-core-mvc/code-snippet/gantt/columns/freezeDirection/tagHelper create mode 100644 ej2-asp-core-mvc/code-snippet/gantt/columns/frozenColumn/frozenColumn.cs create mode 100644 ej2-asp-core-mvc/code-snippet/gantt/columns/frozenColumn/razor create mode 100644 ej2-asp-core-mvc/code-snippet/gantt/columns/frozenColumn/tagHelper create mode 100644 ej2-asp-core-mvc/code-snippet/gantt/columns/frozenLineColor/frozenLineColor.cs create mode 100644 ej2-asp-core-mvc/code-snippet/gantt/columns/frozenLineColor/razor create mode 100644 ej2-asp-core-mvc/code-snippet/gantt/columns/frozenLineColor/tagHelper create mode 100644 ej2-asp-core-mvc/gantt/columns/frozen-column.md diff --git a/ej2-asp-core-mvc/code-snippet/gantt/columns/freezeColumn/freezeColumn.cs b/ej2-asp-core-mvc/code-snippet/gantt/columns/freezeColumn/freezeColumn.cs new file mode 100644 index 0000000000..b46c6534c2 --- /dev/null +++ b/ej2-asp-core-mvc/code-snippet/gantt/columns/freezeColumn/freezeColumn.cs @@ -0,0 +1,173 @@ +using Microsoft.AspNetCore.Mvc.RazorPages; + +namespace WebApplication4.Pages +{ + public class IndexModel : PageModel + { + public List DataSource { get; set; } = new(); + + public void OnGet() + { + DataSource = GetGanttData(); + } + + public static List GetGanttData() + { + return new List + { + // 1. Project Initiation (Parent) + new() { + TaskID = 1, + TaskName = "Project Initiation", + Progress = 100, + Status = "Completed" + }, + new() { + TaskID = 2, + TaskName = "Kickoff Meeting", + ParentID = 1, + StartDate = new DateTime(2025, 3, 3), + Duration = 1, + Progress = 100, + Status = "Completed" + }, + new() { + TaskID = 3, + TaskName = "Requirements Gathering", + ParentID = 1, + StartDate = new DateTime(2025, 3, 4), + Duration = 3, + Progress = 100, + Status = "Completed" + }, + + // 4. System Design (Parent) + new() { + TaskID = 4, + TaskName = "System Design", + Progress = 80, // Average of children + Status = "In Progress" + }, + new() { + TaskID = 5, + TaskName = "Architecture Design", + ParentID = 4, + StartDate = new DateTime(2025, 3, 7), + Duration = 4, + Progress = 90, + Status = "In Progress" + }, + new() { + TaskID = 6, + TaskName = "Database Design", + ParentID = 4, + StartDate = new DateTime(2025, 3, 12), + Duration = 3, + Progress = 70, + Status = "In Progress" + }, + + // 7. Development Phase (Parent) + new() { + TaskID = 7, + TaskName = "Development Phase", + Progress = 62, // Average + Status = "In Progress" + }, + new() { + TaskID = 8, + TaskName = "Backend Development", + ParentID = 7, + StartDate = new DateTime(2025, 3, 15), + Duration = 5, + Progress = 70, + Status = "In Progress" + }, + new() { + TaskID = 9, + TaskName = "Frontend Development", + ParentID = 7, + StartDate = new DateTime(2025, 3, 20), + Duration = 5, + Progress = 55, + Status = "In Progress" + }, + new() { + TaskID = 10, + TaskName = "API Integration", + ParentID = 7, + StartDate = new DateTime(2025, 3, 25), + Duration = 4, + Progress = 60, + Status = "In Progress" + }, + + // 11. Testing Cycle (Parent) + new() { + TaskID = 11, + TaskName = "Testing Cycle", + Progress = 60, // Approx average + Status = "In Progress" + }, + new() { + TaskID = 12, + TaskName = "Test Planning", + ParentID = 11, + StartDate = new DateTime(2025, 3, 29), + Duration = 3, + Progress = 90, + Status = "In Progress" + }, + new() { + TaskID = 13, + TaskName = "Test Execution", + ParentID = 11, + StartDate = new DateTime(2025, 4, 1), + Duration = 4, + Progress = 60, + Status = "In Progress" + }, + new() { + TaskID = 14, + TaskName = "Bug Fixing", + ParentID = 11, + StartDate = new DateTime(2025, 4, 5), + Duration = 4, + Progress = 30, + Status = "In Progress" + }, + + // 15. Deployment & Go-Live (Parent) + new() { + TaskID = 15, + TaskName = "Deployment & Go-Live", + Progress = 0, + Status = "Not Started" + }, + new() { + TaskID = 16, + TaskName = "Final Release", + ParentID = 15, + StartDate = new DateTime(2025, 4, 9), + Duration = 3, + Progress = 0, + Status = "Not Started" + } + }; + } + + public class GanttDataSource + { + public int TaskID { get; set; } + public string? TaskName { get; set; } + public DateTime StartDate { get; set; } + public DateTime? EndDate { get; set; } + public int? Duration { get; set; } + public int? Progress { get; set; } + public string? Predecessor { get; set; } + public int? ParentID { get; set; } + public string? Status { get; set; } + + } + } +} \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/gantt/columns/freezeColumn/razor b/ej2-asp-core-mvc/code-snippet/gantt/columns/freezeColumn/razor new file mode 100644 index 0000000000..8adf013bca --- /dev/null +++ b/ej2-asp-core-mvc/code-snippet/gantt/columns/freezeColumn/razor @@ -0,0 +1,21 @@ +
+ @Html.EJS().Gantt("GanttContainer").Height("430px").DataSource((IEnumerable)ViewBag.DataSource).TreeColumnIndex(1).GridLines(Syncfusion.EJ2.Gantt.GridLine.Both).SplitterSettings(s => s.Position("65%")).LabelSettings(l => l.TaskLabel("Progress")).TaskFields(tf => + { + tf.Id("TaskID") + .Name("TaskName") + .StartDate("StartDate") + .EndDate("EndDate") + .Duration("Duration") + .Progress("Progress") + .Dependency("Predecessor") + .ParentID("ParentID"); + }).Columns(col => + { + col.Field("TaskID").HeaderText("Task ID").IsFrozen(true).Add(); + col.Field("TaskName").HeaderText("Task Name").Width("220").IsFrozen(true).Add(); + col.Field("StartDate").HeaderText("Start Date").Add(); + col.Field("Duration").HeaderText("Duration").Add(); + col.Field("Progress").HeaderText("Progress").Add(); + col.Field("Status").HeaderText("Status").IsFrozen(true).Add(); + }).Render() + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/gantt/columns/freezeColumn/tagHelper b/ej2-asp-core-mvc/code-snippet/gantt/columns/freezeColumn/tagHelper new file mode 100644 index 0000000000..69714157be --- /dev/null +++ b/ej2-asp-core-mvc/code-snippet/gantt/columns/freezeColumn/tagHelper @@ -0,0 +1,24 @@ +@page +@model IndexModel + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/gantt/columns/freezeDirection/freezeDirection.cs b/ej2-asp-core-mvc/code-snippet/gantt/columns/freezeDirection/freezeDirection.cs new file mode 100644 index 0000000000..cd36726b94 --- /dev/null +++ b/ej2-asp-core-mvc/code-snippet/gantt/columns/freezeDirection/freezeDirection.cs @@ -0,0 +1,69 @@ +public ActionResult Index() +{ + ViewBag.DataSource = GanttData(); + ViewBag.Resources = GetResources(); + return View(); +} + +private List GetResources() +{ + return new List + { + new ResourceModel { ResourceId = 1, ResourceName = "Martin Tamer" }, + new ResourceModel { ResourceId = 2, ResourceName = "Rose Fuller" }, + new ResourceModel { ResourceId = 3, ResourceName = "Margaret Buchanan" }, + new ResourceModel { ResourceId = 4, ResourceName = "Fuller King" }, + new ResourceModel { ResourceId = 5, ResourceName = "Davolio Fuller" }, + new ResourceModel { ResourceId = 6, ResourceName = "Van Jack" } + }; +} +public static List GanttData() +{ + return new List + { + new GanttDataSource { TaskID = 1, TaskName = "Project Initiation", StartDate = new DateTime(2025, 3, 1), EndDate = new DateTime(2025, 3, 10), Duration = 8, Progress = 100, Resources = new List { 1 } }, + new GanttDataSource { TaskID = 2, TaskName = "Requirements Gathering", StartDate = new DateTime(2025, 3, 1), EndDate = new DateTime(2025, 3, 5), Duration = 4, Progress = 100, Resources = new List { 5 }, ParentID = 1 }, + new GanttDataSource { TaskID = 3, TaskName = "Feasibility Study", StartDate = new DateTime(2025, 3, 3), EndDate = new DateTime(2025, 3, 7), Duration = 4, Progress = 100, Resources = new List { 2 }, ParentID = 1, Predecessor = "2FS" }, + new GanttDataSource { TaskID = 4, TaskName = "Stakeholder Approval", StartDate = new DateTime(2025, 3, 8), EndDate = new DateTime(2025, 3, 8), Duration = 0, Progress = 100, Resources = new List { 3 }, ParentID = 1, Predecessor = "3FS" }, + + new GanttDataSource { TaskID = 5, TaskName = "Planning Phase", StartDate = new DateTime(2025, 3, 10), EndDate = new DateTime(2025, 3, 20), Duration = 9, Progress = 90, Resources = new List { 1, 5 }, Predecessor = "4FS" }, + new GanttDataSource { TaskID = 6, TaskName = "Project Plan Creation", StartDate = new DateTime(2025, 3, 10), EndDate = new DateTime(2025, 3, 14), Duration = 4, Progress = 100, Resources = new List { 6 }, ParentID = 5 }, + new GanttDataSource { TaskID = 7, TaskName = "Resource Allocation", StartDate = new DateTime(2025, 3, 12), EndDate = new DateTime(2025, 3, 17), Duration = 5, Progress = 85, Resources = new List { 1, 2 }, ParentID = 5, Predecessor = "6FS" }, + new GanttDataSource { TaskID = 8, TaskName = "Risk Assessment", StartDate = new DateTime(2025, 3, 15), EndDate = new DateTime(2025, 3, 19), Duration = 4, Progress = 70, Resources = new List { 1 }, ParentID = 5, Predecessor = "6FS" }, + + new GanttDataSource { TaskID = 9, TaskName = "Design & Development", StartDate = new DateTime(2025, 3, 20), EndDate = new DateTime(2025, 4, 18), Duration = 28, Progress = 65, Resources = new List { 2, 3 }, Predecessor = "5FS" }, + new GanttDataSource { TaskID =10, TaskName = "UI/UX Design", StartDate = new DateTime(2025, 3, 20), EndDate = new DateTime(2025, 3, 28), Duration = 8, Progress = 90, Resources = new List { 4 }, ParentID = 9 }, + new GanttDataSource { TaskID =11, TaskName = "Wireframes & Prototypes", StartDate = new DateTime(2025, 3, 20), EndDate = new DateTime(2025, 3, 26), Duration = 6, Progress = 85, Resources = new List { 4 }, ParentID = 10 }, + new GanttDataSource { TaskID =12, TaskName = "Backend Development", StartDate = new DateTime(2025, 3, 25), EndDate = new DateTime(2025, 4, 10), Duration = 14, Progress = 60, Resources = new List { 2 }, ParentID = 9, Predecessor = "11FS" }, + new GanttDataSource { TaskID =13, TaskName = "API Design", StartDate = new DateTime(2025, 3, 25), EndDate = new DateTime(2025, 3, 29), Duration = 4, Progress = 100, Resources = new List { 2 }, ParentID = 12 }, + new GanttDataSource { TaskID =14, TaskName = "Frontend Development", StartDate = new DateTime(2025, 3, 28), EndDate = new DateTime(2025, 4, 12), Duration = 14, Progress = 55, Resources = new List { 3 }, ParentID = 9, Predecessor = "11FS" }, + + new GanttDataSource { TaskID =15, TaskName = "Testing Phase", StartDate = new DateTime(2025, 4, 10), EndDate = new DateTime(2025, 4, 24), Duration = 12, Progress = 40, Resources = new List { 6 }, Predecessor = "14FS" }, + new GanttDataSource { TaskID =16, TaskName = "Unit Testing", StartDate = new DateTime(2025, 4, 10), EndDate = new DateTime(2025, 4, 15), Duration = 5, Progress = 60, Resources = new List { 6 }, ParentID = 15 }, + new GanttDataSource { TaskID =17, TaskName = "Integration Testing", StartDate = new DateTime(2025, 4, 16), EndDate = new DateTime(2025, 4, 21), Duration = 5, Progress = 30, Resources = new List { 6 }, ParentID = 15, Predecessor = "16FS" }, + + new GanttDataSource { TaskID =18, TaskName = "Deployment", StartDate = new DateTime(2025, 4, 24), EndDate = new DateTime(2025, 4, 24), Duration = 0, Progress = 0, Resources = new List { 5 }, Predecessor = "17FS" }, + new GanttDataSource { TaskID =19, TaskName = "Project Closure", StartDate = new DateTime(2025, 4, 25), EndDate = new DateTime(2025, 4, 29), Duration = 4, Progress = 0, Resources = new List { 1 }, Predecessor = "18FS" }, + new GanttDataSource { TaskID =20, TaskName = "Final Documentation", StartDate = new DateTime(2025, 4, 25), EndDate = new DateTime(2025, 4, 28), Duration = 3, Progress = 0, Resources = new List { 1, 3 }, ParentID = 19 } + }; +} + +// Updated model classes to support resource allocation +public class GanttDataSource +{ + public int TaskID { get; set; } + public string TaskName { get; set; } + public DateTime? StartDate { get; set; } + public DateTime? EndDate { get; set; } + public int? Duration { get; set; } + public int? Progress { get; set; } + public string Predecessor { get; set; } + public int? ParentID { get; set; } + public List Resources { get; set; } = new List(); +} + +public class ResourceModel +{ + public int ResourceId { get; set; } + public string ResourceName { get; set; } +} diff --git a/ej2-asp-core-mvc/code-snippet/gantt/columns/freezeDirection/razor b/ej2-asp-core-mvc/code-snippet/gantt/columns/freezeDirection/razor new file mode 100644 index 0000000000..738af84a7e --- /dev/null +++ b/ej2-asp-core-mvc/code-snippet/gantt/columns/freezeDirection/razor @@ -0,0 +1,13 @@ +
+ @Html.EJS().Gantt("GanttContainer").DataSource((IEnumerable)ViewBag.DataSource).Resources((IEnumerable)ViewBag.Resources).Height("430px").TreeColumnIndex(1).GridLines(Syncfusion.EJ2.Gantt.GridLine.Both).AllowSelection(false).HighlightWeekends(true).SplitterSettings(s => s.Position("65%")).LabelSettings(l => l.TaskLabel("Progress")).TaskFields(tf => { tf.Id("TaskID").Name("TaskName").StartDate("StartDate").EndDate("EndDate").Duration("Duration").Progress("Progress").Dependency("Predecessor").ParentID("ParentID").ResourceInfo("Resources"); }).ResourceFields(rf => { rf.Id("ResourceId").Name("ResourceName"); }).Columns(col => + { + col.Field("TaskID").HeaderText("Task ID").Width("90").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Freeze("Left").Add(); + col.Field("TaskName").HeaderText("Task Name").Width("200").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Left).Add(); + col.Field("StartDate").HeaderText("Start Date").Width("130").Format("yMd").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Add(); + col.Field("Duration").HeaderText("Duration").Width("110").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Add(); + col.Field("EndDate").HeaderText("End Date").Width("130").Format("yMd").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Add(); + col.Field("Progress").HeaderText("Progress").Width("110").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Center).Freeze("Fixed").Add(); + col.Field("Predecessor").HeaderText("Dependency").Width("120").Add(); + col.Field("Resources").HeaderText("Assignee").Width("150").Freeze("Right").Add(); + }).Render() + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/gantt/columns/freezeDirection/tagHelper b/ej2-asp-core-mvc/code-snippet/gantt/columns/freezeDirection/tagHelper new file mode 100644 index 0000000000..ba68ed99dd --- /dev/null +++ b/ej2-asp-core-mvc/code-snippet/gantt/columns/freezeDirection/tagHelper @@ -0,0 +1,27 @@ +@using Syncfusion.EJ2.Gantt + +
+ + + + + + + + + + + + + + + + +
diff --git a/ej2-asp-core-mvc/code-snippet/gantt/columns/frozenColumn/frozenColumn.cs b/ej2-asp-core-mvc/code-snippet/gantt/columns/frozenColumn/frozenColumn.cs new file mode 100644 index 0000000000..e6918afa72 --- /dev/null +++ b/ej2-asp-core-mvc/code-snippet/gantt/columns/frozenColumn/frozenColumn.cs @@ -0,0 +1,43 @@ +using Microsoft.AspNetCore.Mvc.RazorPages; + +namespace WebApplication.Pages +{ + public class IndexModel : PageModel + { + public List DataSource { get; set; } = new(); + + public void OnGet() + { + DataSource = GetGanttData(); + } + + public static List GetGanttData() + { + return new List + { + new GanttDataSource { TaskID = 1, TaskName = "Project Initiation", StartDate = new DateTime(2019, 4, 2), EndDate = new DateTime(2019, 4, 21) }, + new GanttDataSource { TaskID = 2, TaskName = "Identify Site location", StartDate = new DateTime(2019, 4, 2), Duration = 4, Progress = 90, ParentID = 1 }, + new GanttDataSource { TaskID = 3, TaskName = "Perform Soil test", StartDate = new DateTime(2019, 4, 2), Duration = 4, Progress = 40, ParentID = 1 }, + new GanttDataSource { TaskID = 4, TaskName = "Soil test approval", StartDate = new DateTime(2019, 4, 2), Duration = 4, Predecessor = "2FS", Progress = 10, ParentID = 1 }, + new GanttDataSource { TaskID = 5, TaskName = "Project Estimation", StartDate = new DateTime(2019, 4, 2), EndDate = new DateTime(2019, 4, 21) }, + new GanttDataSource { TaskID = 6, TaskName = "Develop floor plan for estimation", StartDate = new DateTime(2019, 4, 4), Duration = 3, Progress = 85, ParentID = 5 }, + new GanttDataSource { TaskID = 7, TaskName = "List materials", StartDate = new DateTime(2019, 4, 4), Duration = 3, Progress = 15, ParentID = 5 }, + new GanttDataSource { TaskID = 8, TaskName = "Estimation approval", StartDate = new DateTime(2019, 4, 4), Duration = 3, Predecessor = "6SS", Progress = 70, ParentID = 5 } + }; + } + + } + + public class GanttDataSource + { + public int TaskID { get; set; } + public string? TaskName { get; set; } + public DateTime StartDate { get; set; } + public DateTime? EndDate { get; set; } + public int? Duration { get; set; } + public int? Progress { get; set; } + public string? Predecessor { get; set; } + public int? ParentID { get; set; } + } + +} diff --git a/ej2-asp-core-mvc/code-snippet/gantt/columns/frozenColumn/razor b/ej2-asp-core-mvc/code-snippet/gantt/columns/frozenColumn/razor new file mode 100644 index 0000000000..1c823adb96 --- /dev/null +++ b/ej2-asp-core-mvc/code-snippet/gantt/columns/frozenColumn/razor @@ -0,0 +1,12 @@ +
+ @Html.EJS().Gantt("GanttContainer").DataSource((IEnumerable)ViewBag.DataSource).Height("430px").TreeColumnIndex(1).FrozenColumns(2).GridLines(Syncfusion.EJ2.Gantt.GridLine.Both).AllowSelection(false).SplitterSettings(new Syncfusion.EJ2.Gantt.GanttSplitterSettings { Position = "65%" }).LabelSettings(new Syncfusion.EJ2.Gantt.GanttLabelSettings { TaskLabel = "Progress" }).TaskFields(new Syncfusion.EJ2.Gantt.GanttTaskFields { Id = "TaskID", Name = "TaskName", StartDate = "StartDate", EndDate = "EndDate", Duration = "Duration", Dependency = "Predecessor", Progress = "Progress", ParentID = "ParentID" }).Columns(col => + { + col.Field("TaskID").HeaderText("Task ID").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Width("90").Add(); + col.Field("TaskName").HeaderText("Task Name").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Left).Width("290").Add(); + col.Field("StartDate").HeaderText("Start Date").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Format("yMd").Width("120").Add(); + col.Field("Duration").HeaderText("Duration").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Width("90").Add(); + col.Field("EndDate").HeaderText("End Date").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Format("yMd").Width("120").Add(); + col.Field("Progress").HeaderText("Progress").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Left).Width("120").Add(); + col.Field("Predecessor").HeaderText("Predecessor").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Left).Width("120").Add(); + }).Render() + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/gantt/columns/frozenColumn/tagHelper b/ej2-asp-core-mvc/code-snippet/gantt/columns/frozenColumn/tagHelper new file mode 100644 index 0000000000..2318db8e08 --- /dev/null +++ b/ej2-asp-core-mvc/code-snippet/gantt/columns/frozenColumn/tagHelper @@ -0,0 +1,33 @@ +@using Syncfusion.EJ2.Gantt + +
+ + + + + + + + + + + +
diff --git a/ej2-asp-core-mvc/code-snippet/gantt/columns/frozenLineColor/frozenLineColor.cs b/ej2-asp-core-mvc/code-snippet/gantt/columns/frozenLineColor/frozenLineColor.cs new file mode 100644 index 0000000000..e6918afa72 --- /dev/null +++ b/ej2-asp-core-mvc/code-snippet/gantt/columns/frozenLineColor/frozenLineColor.cs @@ -0,0 +1,43 @@ +using Microsoft.AspNetCore.Mvc.RazorPages; + +namespace WebApplication.Pages +{ + public class IndexModel : PageModel + { + public List DataSource { get; set; } = new(); + + public void OnGet() + { + DataSource = GetGanttData(); + } + + public static List GetGanttData() + { + return new List + { + new GanttDataSource { TaskID = 1, TaskName = "Project Initiation", StartDate = new DateTime(2019, 4, 2), EndDate = new DateTime(2019, 4, 21) }, + new GanttDataSource { TaskID = 2, TaskName = "Identify Site location", StartDate = new DateTime(2019, 4, 2), Duration = 4, Progress = 90, ParentID = 1 }, + new GanttDataSource { TaskID = 3, TaskName = "Perform Soil test", StartDate = new DateTime(2019, 4, 2), Duration = 4, Progress = 40, ParentID = 1 }, + new GanttDataSource { TaskID = 4, TaskName = "Soil test approval", StartDate = new DateTime(2019, 4, 2), Duration = 4, Predecessor = "2FS", Progress = 10, ParentID = 1 }, + new GanttDataSource { TaskID = 5, TaskName = "Project Estimation", StartDate = new DateTime(2019, 4, 2), EndDate = new DateTime(2019, 4, 21) }, + new GanttDataSource { TaskID = 6, TaskName = "Develop floor plan for estimation", StartDate = new DateTime(2019, 4, 4), Duration = 3, Progress = 85, ParentID = 5 }, + new GanttDataSource { TaskID = 7, TaskName = "List materials", StartDate = new DateTime(2019, 4, 4), Duration = 3, Progress = 15, ParentID = 5 }, + new GanttDataSource { TaskID = 8, TaskName = "Estimation approval", StartDate = new DateTime(2019, 4, 4), Duration = 3, Predecessor = "6SS", Progress = 70, ParentID = 5 } + }; + } + + } + + public class GanttDataSource + { + public int TaskID { get; set; } + public string? TaskName { get; set; } + public DateTime StartDate { get; set; } + public DateTime? EndDate { get; set; } + public int? Duration { get; set; } + public int? Progress { get; set; } + public string? Predecessor { get; set; } + public int? ParentID { get; set; } + } + +} diff --git a/ej2-asp-core-mvc/code-snippet/gantt/columns/frozenLineColor/razor b/ej2-asp-core-mvc/code-snippet/gantt/columns/frozenLineColor/razor new file mode 100644 index 0000000000..2c257b34ab --- /dev/null +++ b/ej2-asp-core-mvc/code-snippet/gantt/columns/frozenLineColor/razor @@ -0,0 +1,29 @@ +
+ @Html.EJS().Gantt("GanttContainer").DataSource((IEnumerable)ViewBag.DataSource).Height("430px").TreeColumnIndex(1).GridLines(Syncfusion.EJ2.Gantt.GridLine.Both).AllowSelection(false).SplitterSettings(new Syncfusion.EJ2.Gantt.GanttSplitterSettings { Position = "65%" }).LabelSettings(new Syncfusion.EJ2.Gantt.GanttLabelSettings { TaskLabel = "Progress" }).TaskFields(new Syncfusion.EJ2.Gantt.GanttTaskFields { Id = "TaskID", Name = "TaskName", StartDate = "StartDate", EndDate = "EndDate", Duration = "Duration", Dependency = "Predecessor", Progress = "Progress", ParentID = "ParentID" }).Columns(col => + { + col.Field("TaskID").HeaderText("Task ID").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Width("90").Freeze("Left").Add(); + col.Field("TaskName").HeaderText("Task Name").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Left).Width("290").Freeze("Left").Add(); + col.Field("StartDate").HeaderText("Start Date").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Format("yMd").Width("120").Add(); + col.Field("Duration").HeaderText("Duration").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Width("90").Add(); + col.Field("EndDate").HeaderText("End Date").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Format("yMd").Width("120").Add(); + col.Field("Progress").HeaderText("Progress").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Left).Width("120").Freeze("Right").Add(); + col.Field("Predecessor").HeaderText("Predecessor").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Left).Width("120").Add(); + }).Render() + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/gantt/columns/frozenLineColor/tagHelper b/ej2-asp-core-mvc/code-snippet/gantt/columns/frozenLineColor/tagHelper new file mode 100644 index 0000000000..0fe841791e --- /dev/null +++ b/ej2-asp-core-mvc/code-snippet/gantt/columns/frozenLineColor/tagHelper @@ -0,0 +1,51 @@ +@page +@model IndexModel +@using Syncfusion.EJ2.Gantt + +
+ + + + + + + + + + + +
+ \ No newline at end of file diff --git a/ej2-asp-core-mvc/gantt/columns/frozen-column.md b/ej2-asp-core-mvc/gantt/columns/frozen-column.md new file mode 100644 index 0000000000..2e9fa92d3a --- /dev/null +++ b/ej2-asp-core-mvc/gantt/columns/frozen-column.md @@ -0,0 +1,170 @@ +--- +layout: post +title: Columns in Syncfusion ##Platform_Name## Gantt Component +description: Learn here all about Columns in Syncfusion ##Platform_Name## Gantt component of Syncfusion Essential JS 2 and more. +platform: ej2-asp-core-mvc +control: Columns +publishingplatform: ##Platform_Name## +documentation: ug +--- + +# Column pinning (Frozen) in ##Platform_Name## Gantt component + +The Syncfusion® ##Platform_Name## Gantt component provides a frozen columns feature that keeps selected columns fixed while scrolling horizontally through large datasets. This functionality ensures that critical information remains visible at all times, improving readability and user experience. By maintaining key columns in view, it simplifies navigation and makes referencing important data points easier when working with extensive project details. + +To enable frozen columns, use the `frozenColumns` property in the Gantt component. + +In the following example, the `frozenColumns` property is set to **2**, which keeps the first two columns fixed on the left while the remaining columns can be scrolled horizontally. + +{% if page.publishingplatform == "aspnet-core" %} + +{% tabs %} +{% highlight cshtml tabtitle="CSHTML" %} +{% include code-snippet/gantt/columns/frozenColumn/tagHelper %} +{% endhighlight %} +{% highlight c# tabtitle="frozenColumn.cs" %} +{% include code-snippet/gantt/columns/frozenColumn/frozenColumn.cs %} +{% endhighlight %} +{% endtabs %} + +{% elsif page.publishingplatform == "aspnet-mvc" %} + +{% tabs %} +{% highlight razor tabtitle="CSHTML" %} +{% include code-snippet/gantt/columns/frozenColumn/razor %} +{% endhighlight %} +{% highlight c# tabtitle="frozenColumn.cs" %} +{% include code-snippet/gantt/columns/frozenColumn/frozenColumn.cs %} +{% endhighlight %} +{% endtabs %} +{% endif %} + +## Freeze particular columns + +The Syncfusion® ##Platform_Name## Gantt provides a feature that enables freezing specific columns, significantly enhancing data visibility and improving the user experience. The `isFrozen` property is used at the column level to freeze a specific column at any desired index on the left side, offering flexibility in managing which columns are frozen. + +To freeze a particular column in the Gantt, set the `isFrozen` property of the column to **true**. + +The following example demonstrates how to freeze a particular column in the Gantt using the `isFrozen` property. + +{% if page.publishingplatform == "aspnet-core" %} + +{% tabs %} +{% highlight cshtml tabtitle="CSHTML" %} +{% include code-snippet/gantt/columns/freezeColumn/tagHelper %} +{% endhighlight %} +{% highlight c# tabtitle="freezeColumn.cs" %} +{% include code-snippet/gantt/columns/freezeColumn/freezeColumn.cs %} +{% endhighlight %} +{% endtabs %} + +{% elsif page.publishingplatform == "aspnet-mvc" %} + +{% tabs %} +{% highlight razor tabtitle="CSHTML" %} +{% include code-snippet/gantt/columns/freezeColumn/razor %} +{% endhighlight %} +{% highlight c# tabtitle="freezeColumn.cs" %} +{% include code-snippet/gantt/columns/freezeColumn/freezeColumn.cs %} +{% endhighlight %} +{% endtabs %} +{% endif %} + +## Freeze direction + +In the Syncfusion® ##Platform_Name## Gantt, the **freeze direction** feature allows you to position frozen columns either to the left, right, or in a fixed position, while still allowing the remaining columns to be horizontally movable. + +To achieve this, the c`olumn.freeze` property can be utilized. This property is used to specify the freeze direction for individual columns. + +The types of the `column.freeze` directions: + +* **Left**: When the `column.freeze` property is set to **Left**, specific columns will be frozen on the left side. + +* **Right**: When the `column.freeze` property is set to **Right**, certain columns will be frozen on the right side. + +* **Fixed**: The Fixed direction locks a column at a fixed position within the Gantt columns. This ensures that the column is always visible during horizontal scroll. + +In the following example, the **TaskID** column is frozen on the left side, the **resources** column is frozen on the right side and the **Progress** column is frozen on the fixed of the content table. + +{% if page.publishingplatform == "aspnet-core" %} + +{% tabs %} +{% highlight cshtml tabtitle="CSHTML" %} +{% include code-snippet/gantt/columns/freezeDirection/tagHelper %} +{% endhighlight %} +{% highlight c# tabtitle="freezeDirection.cs" %} +{% include code-snippet/gantt/columns/freezeDirection/freezeDirection.cs %} +{% endhighlight %} +{% endtabs %} + +{% elsif page.publishingplatform == "aspnet-mvc" %} + +{% tabs %} +{% highlight razor tabtitle="CSHTML" %} +{% include code-snippet/gantt/columns/freezeDirection/razor %} +{% endhighlight %} +{% highlight c# tabtitle="freezeDirection.cs" %} +{% include code-snippet/gantt/columns/freezeDirection/freezeDirection.cs %} +{% endhighlight %} +{% endtabs %} +{% endif %} + +## Change default frozen line color + +The frozen line borders of frozen columns in the Syncfusion® ##Platform_Name## Gantt component can be customized by applying custom CSS styles to the respective frozen columns. This allows you to change the border color of left, right, and fixed frozen columns to match your application's design and theme. + +To change the default frozen line color, use the following CSS class names and apply the desired border color: + +For left frozen columns: + +```css +.e-gantt .e-leftfreeze.e-freezeleftborder { + border-right-color: rgb(0, 255, 0) !important; +} +``` +For right frozen columns: + +```css +.e-gantt .e-rightfreeze.e-freezerightborder { + border-left-color: rgb(0, 0, 255) !important; +} +``` +For fixed frozen columns, both left and right borders need to be specified as mentioned below: + +```css +.e-gantt .e-leftfreeze.e-freezeleftborder { + border-right-color: rgb(0, 255, 0) !important; +} + +.e-gantt .e-rightfreeze.e-freezerightborder { + border-left-color: rgb(0, 0, 255) !important; +} +``` +The following example demonstrates how to change the default frozen line color using CSS: + +{% if page.publishingplatform == "aspnet-core" %} + +{% tabs %} +{% highlight cshtml tabtitle="CSHTML" %} +{% include code-snippet/gantt/columns/frozenLineColor/tagHelper %} +{% endhighlight %} +{% highlight c# tabtitle="frozenLineColor.cs" %} +{% include code-snippet/gantt/columns/frozenLineColor/frozenLineColor.cs %} +{% endhighlight %} +{% endtabs %} + +{% elsif page.publishingplatform == "aspnet-mvc" %} + +{% tabs %} +{% highlight razor tabtitle="CSHTML" %} +{% include code-snippet/gantt/columns/frozenLineColor/razor %} +{% endhighlight %} +{% highlight c# tabtitle="frozenLineColor.cs" %} +{% include code-snippet/gantt/columns/frozenLineColor/frozenLineColor.cs %} +{% endhighlight %} +{% endtabs %} +{% endif %} + +## Limitations + +* Freeze Direction is not compatible with the `isFrozen` and `frozenColumns` properties. \ No newline at end of file diff --git a/ej2-asp-core-toc.html b/ej2-asp-core-toc.html index c19f6ed8da..cbbf388769 100644 --- a/ej2-asp-core-toc.html +++ b/ej2-asp-core-toc.html @@ -1161,6 +1161,7 @@
  • Column Reordering
  • Column Resizing
  • +
  • Column Pinning(Frozen)
  • Column Template
  • Column Menu
  • Responsive Columns
  • diff --git a/ej2-asp-mvc-toc.html b/ej2-asp-mvc-toc.html index 67318929d7..18b91e0df0 100644 --- a/ej2-asp-mvc-toc.html +++ b/ej2-asp-mvc-toc.html @@ -1106,6 +1106,7 @@
    • Column Reordering
    • Column Resizing
    • +
    • Column Pinning(Frozen)
    • Column Template
    • Column Menu
    • Responsive Columns
    • From 35b49602a69017a16feeecc5d86ff8baec73a276 Mon Sep 17 00:00:00 2001 From: Nithya Date: Mon, 8 Dec 2025 11:40:27 +0530 Subject: [PATCH 2/7] 997057: UG Documentation for frozen column --- ej2-asp-core-mvc/gantt/columns/frozen-column.md | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/ej2-asp-core-mvc/gantt/columns/frozen-column.md b/ej2-asp-core-mvc/gantt/columns/frozen-column.md index 2e9fa92d3a..71bf2b4687 100644 --- a/ej2-asp-core-mvc/gantt/columns/frozen-column.md +++ b/ej2-asp-core-mvc/gantt/columns/frozen-column.md @@ -1,9 +1,9 @@ --- layout: post -title: Columns in Syncfusion ##Platform_Name## Gantt Component -description: Learn here all about Columns in Syncfusion ##Platform_Name## Gantt component of Syncfusion Essential JS 2 and more. +title: Column pinning (Frozen) in ##Platform_Name## Gantt control | Syncfusion +description: Learn here all about Column pinning (Frozen) in Syncfusion ##Platform_Name## Gantt component of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc -control: Columns +control: Column pinning (Frozen) publishingplatform: ##Platform_Name## documentation: ug --- @@ -74,7 +74,7 @@ The following example demonstrates how to freeze a particular column in the Gant In the Syncfusion® ##Platform_Name## Gantt, the **freeze direction** feature allows you to position frozen columns either to the left, right, or in a fixed position, while still allowing the remaining columns to be horizontally movable. -To achieve this, the c`olumn.freeze` property can be utilized. This property is used to specify the freeze direction for individual columns. +To achieve this, the `column.freeze` property can be utilized. This property is used to specify the freeze direction for individual columns. The types of the `column.freeze` directions: From e5f2634945fe4de8ca0bf651114b1e0f93c29d66 Mon Sep 17 00:00:00 2001 From: Nithya Date: Mon, 8 Dec 2025 18:36:51 +0530 Subject: [PATCH 3/7] 997875: Limitations of virtualization --- ej2-asp-core-mvc/gantt/selection/cell-selection.md | 6 +++++- ej2-asp-core-mvc/gantt/virtual-scroll.md | 4 ++-- 2 files changed, 7 insertions(+), 3 deletions(-) diff --git a/ej2-asp-core-mvc/gantt/selection/cell-selection.md b/ej2-asp-core-mvc/gantt/selection/cell-selection.md index c99e8cc720..c6ebda0da9 100644 --- a/ej2-asp-core-mvc/gantt/selection/cell-selection.md +++ b/ej2-asp-core-mvc/gantt/selection/cell-selection.md @@ -118,4 +118,8 @@ While selecting a cell in Gantt, the [`cellSelecting`](https://help.syncfusion.c {% include code-snippet/gantt/selection/cellSelectingEvent/cellSelectingEvent.cs %} {% endhighlight %} {% endtabs %} -{% endif %} \ No newline at end of file +{% endif %} + +## Limitations for cell selection + +* Cell-based selection is not supported when virtualization is enabled. \ No newline at end of file diff --git a/ej2-asp-core-mvc/gantt/virtual-scroll.md b/ej2-asp-core-mvc/gantt/virtual-scroll.md index 4605638b64..75e311851a 100644 --- a/ej2-asp-core-mvc/gantt/virtual-scroll.md +++ b/ej2-asp-core-mvc/gantt/virtual-scroll.md @@ -80,6 +80,6 @@ This mode can be enable by setting the [EnableTimelineVirtualization](https://he ## Limitations for virtual scroll * Due to the element height limitation in browsers, the maximum number of records loaded is limited by the browser capacity. -* Cell selection will not be persisted. +* Cell-based selection is not supported when virtualization is enabled. * The number of records rendered will be determined by the `Height` property. -* It is necessary to mention the height of the Gantt in pixels when enabling Virtual Scrolling. +* It is necessary to mention the height of the Gantt in pixels when enabling Virtual Scrolling. \ No newline at end of file From 8daeb220124a5dd2e3063f0b5313564c1ce47b91 Mon Sep 17 00:00:00 2001 From: NithyaSivaprakasam <103498896+NithyaSivaprakasam@users.noreply.github.com> Date: Wed, 17 Dec 2025 11:38:21 +0530 Subject: [PATCH 4/7] Update frozen-column.md --- .../gantt/columns/frozen-column.md | 36 +++++++------------ 1 file changed, 13 insertions(+), 23 deletions(-) diff --git a/ej2-asp-core-mvc/gantt/columns/frozen-column.md b/ej2-asp-core-mvc/gantt/columns/frozen-column.md index 71bf2b4687..45fc81b90a 100644 --- a/ej2-asp-core-mvc/gantt/columns/frozen-column.md +++ b/ej2-asp-core-mvc/gantt/columns/frozen-column.md @@ -1,20 +1,18 @@ --- layout: post -title: Column pinning (Frozen) in ##Platform_Name## Gantt control | Syncfusion -description: Learn here all about Column pinning (Frozen) in Syncfusion ##Platform_Name## Gantt component of Syncfusion Essential JS 2 and more. +title: Column Pinning (Frozen) in ##Platform_Name## Gantt Chart control | Syncfusion +description: Learn here all about column pinning (Frozen) in Syncfusion ##Platform_Name## Gantt Chart control of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc -control: Column pinning (Frozen) +control: Column Pinning (Frozen) publishingplatform: ##Platform_Name## documentation: ug --- -# Column pinning (Frozen) in ##Platform_Name## Gantt component +# Column Pinning (Frozen) in ##Platform_Name## Gantt Chart control -The Syncfusion® ##Platform_Name## Gantt component provides a frozen columns feature that keeps selected columns fixed while scrolling horizontally through large datasets. This functionality ensures that critical information remains visible at all times, improving readability and user experience. By maintaining key columns in view, it simplifies navigation and makes referencing important data points easier when working with extensive project details. +The Syncfusion® ##Platform_Name## Gantt Chart control provides a frozen columns feature that keeps selected columns fixed while scrolling horizontally through large datasets. This functionality ensures that critical information remains visible at all times, improving readability and user experience. By maintaining key columns in view, it simplifies navigation and makes referencing important data points easier when working with extensive project details. -To enable frozen columns, use the `frozenColumns` property in the Gantt component. - -In the following example, the `frozenColumns` property is set to **2**, which keeps the first two columns fixed on the left while the remaining columns can be scrolled horizontally. +To enable frozen columns, use the `frozenColumns` property in the Gantt Chart control. In the following example, the `frozenColumns` property is set to **2**, which keeps the first two columns fixed on the left while the remaining columns can be scrolled horizontally. {% if page.publishingplatform == "aspnet-core" %} @@ -41,11 +39,9 @@ In the following example, the `frozenColumns` property is set to **2**, which ke ## Freeze particular columns -The Syncfusion® ##Platform_Name## Gantt provides a feature that enables freezing specific columns, significantly enhancing data visibility and improving the user experience. The `isFrozen` property is used at the column level to freeze a specific column at any desired index on the left side, offering flexibility in managing which columns are frozen. - -To freeze a particular column in the Gantt, set the `isFrozen` property of the column to **true**. +The Syncfusion® ##Platform_Name## Gantt Chart provides a feature that enables freezing specific columns, significantly enhancing data visibility and improving the user experience. The `isFrozen` property is used at the column level to freeze a specific column at any desired index on the left side, offering flexibility in managing which columns are frozen. -The following example demonstrates how to freeze a particular column in the Gantt using the `isFrozen` property. +To freeze a particular column in the Gantt, set the `isFrozen` property of the column to **true**. The following example demonstrates how to freeze a particular column in the Gantt Chart using the `isFrozen` property. {% if page.publishingplatform == "aspnet-core" %} @@ -72,17 +68,13 @@ The following example demonstrates how to freeze a particular column in the Gant ## Freeze direction -In the Syncfusion® ##Platform_Name## Gantt, the **freeze direction** feature allows you to position frozen columns either to the left, right, or in a fixed position, while still allowing the remaining columns to be horizontally movable. - -To achieve this, the `column.freeze` property can be utilized. This property is used to specify the freeze direction for individual columns. - -The types of the `column.freeze` directions: +In the Syncfusion® ##Platform_Name## Gantt, the **freeze direction** feature allows you to position frozen columns either to the left, right, or in a fixed position, while still allowing the remaining columns to be horizontally movable. To achieve this, the `column.freeze` property can be utilized. This property is used to specify the freeze direction for individual columns. The types of the `column.freeze` directions: * **Left**: When the `column.freeze` property is set to **Left**, specific columns will be frozen on the left side. * **Right**: When the `column.freeze` property is set to **Right**, certain columns will be frozen on the right side. -* **Fixed**: The Fixed direction locks a column at a fixed position within the Gantt columns. This ensures that the column is always visible during horizontal scroll. +* **Fixed**: The fixed direction locks a column at a fixed position within the Gantt Chart columns. This ensures that the column is always visible during horizontal scroll. In the following example, the **TaskID** column is frozen on the left side, the **resources** column is frozen on the right side and the **Progress** column is frozen on the fixed of the content table. @@ -109,9 +101,11 @@ In the following example, the **TaskID** column is frozen on the left side, the {% endtabs %} {% endif %} +N> The freeze direction is not compatible when both the `isFrozen` and `frozenColumns` properties are enabled simultaneously. + ## Change default frozen line color -The frozen line borders of frozen columns in the Syncfusion® ##Platform_Name## Gantt component can be customized by applying custom CSS styles to the respective frozen columns. This allows you to change the border color of left, right, and fixed frozen columns to match your application's design and theme. +The frozen line borders of frozen columns in the Syncfusion® ##Platform_Name## Gantt Chart control can be customized by applying custom CSS styles to the respective frozen columns. This allows to change the border color of left, right, and fixed frozen columns to match your application's design and theme. To change the default frozen line color, use the following CSS class names and apply the desired border color: @@ -164,7 +158,3 @@ The following example demonstrates how to change the default frozen line color u {% endhighlight %} {% endtabs %} {% endif %} - -## Limitations - -* Freeze Direction is not compatible with the `isFrozen` and `frozenColumns` properties. \ No newline at end of file From 811d3040b20faefdf663df599d0731841d777945 Mon Sep 17 00:00:00 2001 From: NithyaSivaprakasam <103498896+NithyaSivaprakasam@users.noreply.github.com> Date: Wed, 17 Dec 2025 17:20:09 +0530 Subject: [PATCH 5/7] Fix title formatting in frozen-column.md --- ej2-asp-core-mvc/gantt/columns/frozen-column.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/ej2-asp-core-mvc/gantt/columns/frozen-column.md b/ej2-asp-core-mvc/gantt/columns/frozen-column.md index 45fc81b90a..549be645a6 100644 --- a/ej2-asp-core-mvc/gantt/columns/frozen-column.md +++ b/ej2-asp-core-mvc/gantt/columns/frozen-column.md @@ -1,6 +1,6 @@ --- layout: post -title: Column Pinning (Frozen) in ##Platform_Name## Gantt Chart control | Syncfusion +title: Column Pinning (Frozen) in ##Platform_Name## Gantt Chart | Syncfusion description: Learn here all about column pinning (Frozen) in Syncfusion ##Platform_Name## Gantt Chart control of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc control: Column Pinning (Frozen) @@ -8,7 +8,7 @@ publishingplatform: ##Platform_Name## documentation: ug --- -# Column Pinning (Frozen) in ##Platform_Name## Gantt Chart control +# Column Pinning (Frozen) in ##Platform_Name## Gantt Chart Control The Syncfusion® ##Platform_Name## Gantt Chart control provides a frozen columns feature that keeps selected columns fixed while scrolling horizontally through large datasets. This functionality ensures that critical information remains visible at all times, improving readability and user experience. By maintaining key columns in view, it simplifies navigation and makes referencing important data points easier when working with extensive project details. From b553ffde7ed1fab57f5d81178f825d52e25881ef Mon Sep 17 00:00:00 2001 From: NithyaSivaprakasam <103498896+NithyaSivaprakasam@users.noreply.github.com> Date: Wed, 17 Dec 2025 17:49:05 +0530 Subject: [PATCH 6/7] Update frozen-column.md --- ej2-asp-core-mvc/gantt/columns/frozen-column.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ej2-asp-core-mvc/gantt/columns/frozen-column.md b/ej2-asp-core-mvc/gantt/columns/frozen-column.md index 549be645a6..790ba9d40c 100644 --- a/ej2-asp-core-mvc/gantt/columns/frozen-column.md +++ b/ej2-asp-core-mvc/gantt/columns/frozen-column.md @@ -1,6 +1,6 @@ --- layout: post -title: Column Pinning (Frozen) in ##Platform_Name## Gantt Chart | Syncfusion +title: Column Pinning (Frozen) in ##Platform_Name## Gantt Chart Control | Syncfusion description: Learn here all about column pinning (Frozen) in Syncfusion ##Platform_Name## Gantt Chart control of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc control: Column Pinning (Frozen) From bf12961976a3f1c8327eaadc8251d04fde22a313 Mon Sep 17 00:00:00 2001 From: NithyaSivaprakasam <103498896+NithyaSivaprakasam@users.noreply.github.com> Date: Thu, 18 Dec 2025 11:50:45 +0530 Subject: [PATCH 7/7] Update title formatting in frozen-column.md --- ej2-asp-core-mvc/gantt/columns/frozen-column.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ej2-asp-core-mvc/gantt/columns/frozen-column.md b/ej2-asp-core-mvc/gantt/columns/frozen-column.md index 790ba9d40c..549be645a6 100644 --- a/ej2-asp-core-mvc/gantt/columns/frozen-column.md +++ b/ej2-asp-core-mvc/gantt/columns/frozen-column.md @@ -1,6 +1,6 @@ --- layout: post -title: Column Pinning (Frozen) in ##Platform_Name## Gantt Chart Control | Syncfusion +title: Column Pinning (Frozen) in ##Platform_Name## Gantt Chart | Syncfusion description: Learn here all about column pinning (Frozen) in Syncfusion ##Platform_Name## Gantt Chart control of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc control: Column Pinning (Frozen)