smart-html-elements

GanttChart Blazor API

GanttChart Properties

Name	Type	Default	Description
AdjustToNonworkingTime	bool	false	Determines whether nonworkingDays/nonworkingHours are taken into considuration when determining the dateEnd of the tasks. When this property is enabled the dateEnd of the tasks is calculated to include only the actual working time. By default it's disabled and only calendar time is used.
AutoSchedule	bool	false	Recalculates the tasks that are connected and re-schedules them according to their connections. If no connections are present, autoScheduling has no effect until a connection is created. Connection types determines the start/end date limits of the tasks.
AutoScheduleStrictMode	bool	false	Affects the tasks only when autoSchedule is enabled. When set to true, the tasks are strictly scheduled ( according to their connections ) and dragging is not allowed. Users can set lag to specific connections to determine a delay of overlap of between the two tasks ( interval of time in miliseconds ). Lag one of the attributes of a task connection and should be set in the dataSource where the task connections are defined.
AutoScrollStep	int	5	Determines the scroll speed when dragging when autoScroll property is set.
ColumnMenu	bool	false	Enabled/Disables the colummn header menu. When enabled and the user hovers a column header, a drop down button will appear that triggers a column menu for quick actions like sorting, filtering, etc. The actions depend on the enabled Gantt features, for example the filtering action will be available only if filtering is enabled for the element.
ColumnResize	bool	false	Determines whether the Table columns are resizable or not. When enabled it is possible to resize the columns from the header cells of the Table in both Task and Resource timelines.
ColumnResizeFeedback	bool	false	Determines resize feedback is used during column resizing. This property is applicable only when columnResize is enabled.
CurrentTimeIndicator	bool	false	Enables/Disables the current time indicator. Current time indicator shows the current time in the appropriate view cells.
CurrentTimeIndicatorInterval	int	1	Determines the refresh interval in seconds for the currentTimeIndicator.
DataExport	GanttChartDataExport	N/A	Sets the GanttChart's Data Export options.
DataSource	object	N/A	Determines the tasks that will be loaded inside the Timeline. Each item represents an object that should contain the following properties: label - the label of the Task dateStart - the starting date of the Task. Should be a string representing a valid date. dateEnd - the ending date of the Task. Should be a string representing a valid date. type - determines the type of the task. Whether it's a simple task, a project or a milestone. Each type of task has specific behavior and additional attributes. . Additional properties: connections - an array of objects representing the connection between two tasks. Each connection (object) should have the following properties : target - a number representing the index of the target task type - a number representing the type of the connection. Four types of connections are available: 0 - is a connection of type Start-to-Start 1 - is a connection of type End-to-Start 2 - is a connection of type End-to-End 3 - is a connection of type Start-to-End lag - a number that determines the delay between two connected auto scheduled tasks. Lag property can be a positive or a negative number. When negative it determines the overlap between two connected tasks. This property is used in conjuction with autoSchedule. duration - determines the duration of a Task in days, hours, minutes, seconds or miliseconds. Very usefull when the the dateEnd of a Task is unknown. The duration always shows the calendar time whether it is in days/hours or other. minDuration - sets the minimum duration of a task. maxDuration - sets the maximum duration of a task. minDateStart - determines the mininum date that a task can start from. Must be if type string and should represent a valid date. maxDateStart - determines the maximum date that a task can start from. Must be if type string and should represent a valid date. minDateEnd - determines the mininum date that a task can end. Must be if type string and should represent a valid date. maxDateEnd - determines the maximum date that a task can end. Must be if type string and should represent a valid date. progress - a number that determines the progress of a task ( from 0 to 100 ). overdue - a boolean that indicates whether the task's dateEnd has surpassed it's deadline date. disableDrag - a boolean property that disables the dragging of a task when set to true. disableResize - a boolean property that disables the resizing of a task when set to true. dragProject - a boolean that determines whether or not the whole project (along with the tasks) can be dragged while dragging the project task. Applicalbe only to Projects. segments - an array of objects that allows to devide a task into multiple segements. Each segment (except the first) can have a different starting date, duration and label. synchronized - a boolean that if set the project task's start/end dates are automatically calculated based on the tasks. By default a synchronized project task can't be dragged alone. Applicable only to Project tasks. expanded - a boolean that determines if a project is expanded or not. If not all of it's sub-tasks are not visible. Only the project task itself is visible. By default no projects are expanded. Applicable only to project tasks.. GanttChart also accepts a IEnumerable<object> instance as dataSource. .
DayFormat	GanttDayFormat	GanttDayFormat.Short	Determines the format of the dates in the timeline header when they represent days.
DateEnd	object		Determines a specific end date for the Timeline. Usefull when the user wants custom ending date for the Timeline. If no date is set the end date of the timeline is automatically determined from the tasks.
DateStart	object		Determines a specific starting date for the Timeline. Usefull when the user wants custom starting date for the Timeline. If no date is set the start date of the timeline is automatically determined from the tasks.
DateMarkers	IEnumerable<IGanttChartDateMarker>	N/A	Determines the date markers that will be displayed inside the timeline. Date markers allow to mark and even label specific dates (including time) inside the GanttChart timeline.
Disabled	bool	false	Enables or disables the element.
DisableAutoScroll	bool	false	Disables auto scrolling while dragging/resizing a task bar inside the Timeline.
DisableTaskDrag	bool	false	Disables dragging of tasks in the Timeline.
DisableTaskProgressChange	bool	false	Disables task progress changing in the Timeline.
DisableTaskResize	bool	false	Disables resizing of tasks in the Timeline.
DisableSelection	bool	false	Disables the selection inside the GanttChart.
DisableSegmentDrag	bool	false	Disables the task segment dragging.
DisableSegmentResize	bool	false	Disables the task segment resizing.
DisableWindowEditor	bool	false	Disables the window editor for the GanttChart.
DurationUnit	Duration	Duration.Milisecond	Determines in what unit is task duration property measured.
FilterRow	bool	false	Determines whether a dedicated filter row is used for Table filtering instead of the default filter input. This property has no effect if filtering is not enabled.
GroupByResources	bool	false	Groups the tasks inside the Task timeline according to the resources they are assigned to. Unassigned tasks are placed in a default group labeled 'Unassigned'.
HeaderTemplate	object	N/A	Allows to create a custom header content for the Task Panel. The attribute accepts an HTMLTemplate element, it's id or a function.
HideDateMarkers	bool	false	Determines whether the dateMarkers are visible or not.
HideTimelineHeaderDetails	bool	false	By default the Timeline has a two level header - timeline details and timeline header. This property hides the header details container( the top container ).
ShowSelectionColumn	bool	false	Shows the selection column of the Task/Resource Table. When applied a checkbox column is displayed that allows to select tasks/resources.
HideResourcePanel	bool	false	Hides the Resource panel regardless of the resources availability By default the Resource panel is visible if resources are added to the GanttChart. This property allows to hide the Resource panel permanently.
HorizontalScrollBarVisibility	HorizontalScrollBarVisibility	HorizontalScrollBarVisibility.Auto	Determines weather or not horizontal scrollbar is shown.
HourFormat	HourFormat	HourFormat.Numeric	Determines the format of the dates inside the timeline header when they represent hours.
InfiniteTimeline	bool	false	When enabled, scrolling to the end of the horizotal timeline, triggers the creation of additional to extend the time range. The number of cells to be added when the scrollbar reaches the end position is determined by the infiniteTimelineStep.
InfiniteTimelineStep	int	5	Determines the number of cells to be added when the horizontal scroll bar of the Timeline reaches it's end position when infiniteTimeline is enabled.
Inverted	bool	false	When set the Timeline is positioned on the left side while the Task Tree is positioned on the right. By default it's vice versa.
KeyboardNavigation	bool	false	Determines whether keyboard navigation inside the Table is enabled or not. Keyboard navigation affects both Task and Resource Tables. It allows to navigate between items. the following keyboard shortcut keys are available for focused tasks inside the Task Table: Enter - opens the Window editor to edit the currently focused task. Delete - opens a confirmation window regarding the deletion of the currently focused task.
Locale	string	"en"	Determines the language of the GanttChart.
Max	object	2100-1-1	Detetmines the maximum possible date of the Timeline.
Min	object	1900-1-1	Detetmines the minimum possible date of the Timeline.
Messages	object	N/A	Sets or gets an object specifying strings used in the widget that can be localized. Used in conjunction with the property locale.
MonthFormat	MonthFormat	MonthFormat.Short	Determines the format of the dates the timeline header when they represent months.
NonworkingDays	int[]	new int[]{}	Determines the nonworking days of the week from 0 to 6, where 0 is the first day of the week and 6 is the last day. Nonworking days will be displayed with colored cells inside the timeline and will not affect the dateEnd of the tasks unless the adjustToNonworkingTime property is enabled.
NonworkingHours	IEnumerable<object>	N/A	Determines the nonworking hours of a day. Hours are represented as numbers inside an array (e.g. [1,2,3] - means 1,2 and 3 AM) or number ranges represented as nested arrays(e.g. [[0,6]] - means from 0 to 6 AM). In the timline the cells that represent nonworking days are colored differently from the rest and will not affect the dateEnd of the tasks unless the adjustToNonworkingTime property is enabled.
PopupWindowTabs	string[]	new string[]{}	Determines which Tab items are visible inside the popup window. Three possible values are allowed: general - the general tab with task properties determines by the taskColumns property. dependency - the dependency tab which shows the connections to the task and allows to create/delete connections. segments - the segments tab which shows the segments of the task and allows to created/delete segments. .
Resources	object	N/A	A getter that returns a flat structure as an array of all resources inside the element.
ResourceColumns	IEnumerable<IGanttChartResourceColumn>	N/A	Deteremines the columns that will be visible in the Resource Tree. Each entry in the value of this property must be of type Object. It should contain the label and value keys. The value of label determines the column header label inside the Task Tree. The value of value determines the content of the cells in the column. By default, one column with all resource labels is visible. Additional properties: formatFunction - a function that allows to customize the content of each record in the column. The function accepts two arguments - the actual label as string that is going to be inserted and the index of the resource. The function must return a string as the new content. min - controls the min size of the column max - controls the max size of the column size - controls the actual size of the column
ResourceFiltering	bool	false	Determines whether the Resource Table is filterable or not.
ResourcePanelHeaderTemplate	object	N/A	Allows to create a custom header content for the Resource Panel. The attribute accepts an HTMLTemplate element, it's id or a function.
ResourcePanelMin	object	100	Determines the min size of the Resource Panel.
ResourcePanelSize	object		Determines the size of the Resource Panel.
ResourcePanelRefreshRate	int	0	Determines the refresh rate of the Resource Panel when dragging/resizing/progress changing a Task from the Timeline. This property allows to customize the interval between resource Tree/Timeline refreshes. By default they refresh immediately after a change.
ResourceTimelineMode	GanttChartResourceTimelineMode	GanttChartResourceTimelineMode.Diagram	Determines how the capacity of the resources will be visualized inside the resource timeline. By default, the capacity is measured in hours depending on the view property of the element.
ResourceTimelineView	GanttChartResourceTimelineView	GanttChartResourceTimelineView.Hours	Determines how the resources will be displayed inside the resource Timeline.
RightToLeft	bool	false	Sets or gets the value indicating whether the element is aligned to support locales using right-to-left fonts.
SelectedTaskIds	IEnumerable<object>	N/A	Sets which tasks to select by their id or gets the currently selected task ids. If no id is provided for the task, an internal id is generated for each task according to it's index(tree path).
SelectedResourceIds	IEnumerable<object>	N/A	Sets which resources to select by their id or gets the currently selected resource ids. If no id is provided for the resource, an internal id is generated for each resource according to it's index(tree path).
ShadeUntilCurrentTime	bool	false	Enables/Disables the current time shader. If enabled all cells that represent past time will be shaded.
ShowBaseline	bool	false	Determines whether the baselnes of the tasks are visible or not. Baselines are defined via the 'planned' attribute on the task objects of the dataSource property.
ShowProgressLabel	bool	false	Shows the progress label inside the progress bars of the Timeline tasks.
SnapToNearest	bool	false	If set the dateStart/dateEnd of the tasks will be coerced to the nearest timeline cell date ( according to the view ). Affects the dragging operation as well.
SortMode	GanttChartSortMode	GanttChartSortMode.None	Determines whether the GanttChart can be sorted by one, more then one or no columns.
Tasks	IEnumerable<IGanttChartTask>		A getter that returns a flat structure as an array of all tasks inside the element.
TaskColumns	IEnumerable<IGanttChartTaskColumn>	N/A	Deteremines the columns that will be visible in the Task Tree. Each entry in the value of this property must be of type Object. It should contain the label and value keys. The value of label determines the column header label inside the Task Tree. The value of value determines the content of the cells in the column. It should reference a task attribute from the dataSource. By default, one column with all task labels is visible. Additional properties: formatFunction - a function that allows to customize the content of each record in the column. The function accepts one argument - the actual label as string that is going to be inserted and must return some content. min - controls the min size of the column max - controls the max size of the column size - controls the actual size of the column customEditor - a callback that can be used to set a custom editor for the column when editing via the window. It accepts two arguments label - the label of the column value - the value of the column. The callback must return the editor. setCustomEditorValue - a callback that is used to set the value of the custom editor. getCustomEditorValue - a callback that is used to get the value of the custom editor.
TaskFiltering	bool	false	Determines whether the Task Table is filterable or not.
TaskPanelMin	object	200	Determines the min size of the Task Panel. Used when Resource Panel is visible.
TaskPanelSize	object		Determines the size of the Task Panel. Used when Resource Panel is visible.
TimelineMin	object	200	Determines the min width of the timeline.
TreeMin	object	100	Determines the min width of the task table.
TreeSize	object	100	Determines the size(width) of the task table.
Tooltip	GanttChartTooltip	N/A	Determines whether the tooltips are enabled or not. Tooltips are available for timeline tasks, resources, connections, indicators and segments.
VerticalScrollBarVisibility	VerticalScrollBarVisibility	VerticalScrollBarVisibility.Auto	Determines weather or not vertical scrollbar is shown.
View	GanttChartView	GanttChartView.Year	Determines the viewing date range of the timeline. Possible values: day - The timeline show the hours of the day. week - the timeline shows the days of the week. month - the timeline shows the days of the month. year - the timeline shows the months of the year. resource - displays the current tasks by grouping them according to the resources they have assigned. The unassigned tasks will be placed in a separate group called 'Unassigned'. The timeline has a header section that contains the labels of each cell according to the date inside them. The header is splitted in two sections in order to give a more detailed information of the dates.
YearFormat	YearFormat	YearFormat.Numeric	Determines the format of the dates inside the timeline header when they represent years.
WeekFormat	WeekFormat	WeekFormat.Long	Determines the format of the dates inside the timeline header when they represent weeks.
Theme	string	""	Sets or gets the element's visual theme.
Unfocusable	bool	false	Sets or gets if the element can be focused.

GanttChart Methods

Name	Type	Arguments	Description
AddFilter	void	IEnumerable<object> columns, object filterGroup	Adds a custom filter to a specific column (task or resource column).Args: IEnumerable<object> columns - An object or an array of objects with the following syntax: <ul><li><b>type</b> - indicates the type of column to filter. Possible values are 'task' or 'resource'.</li><li><b>value</b> - the value of the column that must match the value attribute of a taskColumns/resourceColumns object(e.g. 'label', 'dateStart', etc).</li></ul>.,object filterGroup - A Smart.Utilities.FilterGroup object. Here's an example for creating a FilterGroup object: <pre>const filterGroup = new window.Smart.Utilities.FilterGroup(), filterObject = filterGroup.createFilter('string', 'Task B', 'STARTS_WITH_CASE_SENSITIVE'); filterGroup.addFilter('or', filterObject); gantt.addFilter({ type: 'task', value: 'label' }, filterGroup);</pre>
BeginUpdate	void	N/A	Starts an update operation. This is appropriate when calling multiple methods or set multiple properties at once.
ClearFilters	void	N/A	Clears the currently applied filters.
ClearResources	void	N/A	Removes all resources.
ClearSelection	void	N/A	Unselects all currently selected items inside the GanttChart including Tasks and Resources. It also clears the assignment highlgihters.
ClearSort	void	N/A	Clears the currently applied column sorting.
ClearState	void	N/A	Removes a previously saved state of the element form LocalStorage according to it's id. "Requires an id to be set to the element."
ClearTasks	void	N/A	Removes all tasks.
CloseWindow	void	N/A	Closes an opened popup Window. The method will close any opened popup window inside the element.
Collapse	void	object id	Collapses an expanded project.Args: string id - The id of a project item that should be collapsed.
Collapse	void	string id	Collapses an expanded project.Args: string id - The id of a project item that should be collapsed.
Collapse	void	int id	Collapses an expanded project.Args: string id - The id of a project item that should be collapsed.
CreateConnection	void	object startTaskIndex, object taskEndIndex, int connectionType, int lag	Creates a connection between two tasks. Args: object startTaskIndex - The id of the start task or the connection string like '2-3-0'. <b>If the complete connections string is provided as the first argument, the rest of the method arguments are not necessary</b>,object taskEndIndex - The id of the end task.,int connectionType - The type of the connection. A numeric value from 0 to 3. The connection type can be: <ul><li><b>0</b> - Start-to-Start connection.</li><li><b>1</b> - End-to-Start connection.</li><li><b>2</b> - End-to-End connection.</li><li><b>3</b> - Start-to-End connection.</li></ul>,int lag - The connection lag in miliseconds. Used by the Auto scheduling algorithm in order allow some slack time slack time before or after the next task begins/ends. Lag is measured in miliseconds. It can be a negative (lead) or a positive (lag) number.
CreateConnection	void	object startTaskIndex	Creates a connection between two tasks.
CreateConnection	void	int startTaskIndex, int taskEndIndex, int connectionType, int lag	Creates a connection between two tasks. Args: int startTaskIndex - The id of the start task or the connection string like '2-3-0'. <b>If the complete connections string is provided as the first argument, the rest of the method arguments are not necessary</b>,int taskEndIndex - The id of the end task.,int connectionType - The type of the connection. A numeric value from 0 to 3. The connection type can be: <ul><li><b>0</b> - Start-to-Start connection.</li><li><b>1</b> - End-to-Start connection.</li><li><b>2</b> - End-to-End connection.</li><li><b>3</b> - Start-to-End connection.</li></ul>,int lag - The connection lag in miliseconds. Used by the Auto scheduling algorithm in order allow some slack time slack time before or after the next task begins/ends. Lag is measured in miliseconds. It can be a negative (lead) or a positive (lag) number.
CreateConnection	void	int startTaskIndex	Creates a connection between two tasks.
CreateConnection	void	string startTaskIndex, string taskEndIndex, int connectionType, int lag	Creates a connection between two tasks. Args: string startTaskIndex - The id of the start task or the connection string like '2-3-0'. <b>If the complete connections string is provided as the first argument, the rest of the method arguments are not necessary</b>,string taskEndIndex - The id of the end task.,int connectionType - The type of the connection. A numeric value from 0 to 3. The connection type can be: <ul><li><b>0</b> - Start-to-Start connection.</li><li><b>1</b> - End-to-Start connection.</li><li><b>2</b> - End-to-End connection.</li><li><b>3</b> - Start-to-End connection.</li></ul>,int lag - The connection lag in miliseconds. Used by the Auto scheduling algorithm in order allow some slack time slack time before or after the next task begins/ends. Lag is measured in miliseconds. It can be a negative (lead) or a positive (lag) number.
CreateConnection	void	string startTaskIndex	Creates a connection between two tasks.
EndUpdate	void	N/A	Ends the update operation. This method will resume the rendering and will refresh the GanttChart.
EnsureVisible	void	object taskId	Makes sure a Task is visible by scrolling to it.Args: string taskId - The id of the target Task.
EnsureVisible	void	string taskId	Makes sure a Task is visible by scrolling to it.Args: string taskId - The id of the target Task.
EnsureVisible	void	int taskId	Makes sure a Task is visible by scrolling to it.Args: int taskId - The id of the target Task.
Expand	void	object id	Expands a collapsed project with tasks.Args: string id - The id of a project task that should be expanded.
Expand	void	string id	Expands a collapsed project with tasks.Args: string id - The id of a project task that should be expanded.
Expand	void	int id	Expands a collapsed project with tasks.Args: string id - The id of a project task that should be expanded.
ExportData	void	string dataFormat, object callback	Exports the data of Tree of the GanttChart.Args: string dataFormat - Determines the format of the exported file. Three possible values are available: <ul><li><b>pdf</b></li><li><b>xlsx</b></li><li><b>html</b></li><li><b>tsv</b></li><li><b>csv</b></li><li><b>xml</b></li></ul>,object callback - A callback that allows to format the exported data based on a condition. For additional details, refer ro the Smart Export Documentation.
ExportData	void	string dataFormat	Exports the data of Tree of the GanttChart.
GetConnectionDetails	object	string connectionId	Returns the connection details for the target connection which includes: startTask, endTask, startTaskId, endTaskId and type of the corresponding connection. Connection types are described in detail under the `connectionEnd` event description in this document and in a dedicated topic available on the website.Args: string connectionId - A connection id. Each connection has a unique id that is assigned when a connection is created.
GetConnections	IEnumerable<object>	N/A	Returns all existing connections. The connections are returned as objects that contain detailed information. Each object in the array has the following keys: 'id' - connection id, 'type' - connection type, 'startTaskId' - connection's start task id, 'endTaskId' - connection's end task id, 'startIndex' - connection's start task index, 'endIndex' - connection's end task index, 'lag' - lag time.
GetDataSourceAsync()	Task<IEnumerable<object>>	'N/A'	Gets the "DataSource" property as Task<IEnumerable<object>>.
GetIsExpandedAsync()	Task<bool>	'N/A'	Gets the "IsExpanded" property as Task<bool>.
GetItemPath	string	object item	Returns the Tree path of a task/resource. The tree path is used as task/resource id if no id is provided by the user.Args: object item - A GattChartTask/GanttChartResource item object.
GetResource	object	object itemId	Returns the resource object that corresponds to the id/path.Args: string itemId - The id/path of a resource.
GetResource	object	string itemId	Returns the resource object that corresponds to the id/path.Args: string itemId - The id/path of a resource.
GetResource	object	int itemId	Returns the resource object that corresponds to the id/path.Args: int itemId - The id/path of a resource.
GetResourceIndex	int	object resource	Returns the index of a resource.Args: object resource - A GanttChartResource object.
GetResourceTasks	IEnumerable<object>	object resource	Returns the tasks that are assigned to the resource.Args: object resource - A GanttChartResource object or it's id.
GetResourceTasks	IEnumerable<object>	string resource	Returns the tasks that are assigned to the resource.Args: string resource - A GanttChartResource object or it's id.
GetResources	IEnumerable<object>	N/A	Returns an array of all GanttChart resources.
GetSelectedIds	IEnumerable<object>	N/A	Returns the currently selected tasks/resource ids. If selection is disabled or no items are selected returns null.
GetSelectedResources	IEnumerable<object>	N/A	Returns the currently selected resources.
GetSelectedTasks	IEnumerable<object>	N/A	Returns the currently selected tasks.
GetState	IEnumerable<object>	N/A	Returns a JSON representation of all tasks inside the element along with their connections and settings.
GetTask	object	object itemId	Returns the task object that corresponds to the id/path.Args: string itemId - The id/path of a task.
GetTask	object	string itemId	Returns the task object that corresponds to the id/path.Args: string itemId - The id/path of a task.
GetTask	object	int itemId	Returns the task object that corresponds to the id/path.Args: int itemId - The id/path of a task.
GetTaskConnections	object	object taskId	Returns the connections definitions of a task.Args: object taskId - A GanttChartTask object or it's id.
GetTaskConnections	object	string taskId	Returns the connections definitions of a task.Args: string taskId - A GanttChartTask object or it's id.
GetTaskConnections	object	int taskId	Returns the connections definitions of a task.Args: int taskId - A GanttChartTask object or it's id.
GetTaskIndex	int	object task	Returns the index of a task.Args: object task - A GattChartTask object.
GetTaskProject	object	object task	Returns the Project of a task or undefined if it does not have one.Args: object task - A GantChartTask object.
GetTasks	IEnumerable<object>	N/A	Returns an array of all GanttChart tasks.
GetValueAsync()	Task<string>	'N/A'	Gets the "Value" property as Task<string>.
GetWorkingHours	IEnumerable<object>	N/A	Returns the working hours of the day as numbers.
HideTooltip	IEnumerable<object>	N/A	Hides the tooltip if it's visible.
InsertResource	void	object resourceId, object resourceObject	Inserts a new resource.Args: string resourceId - A string that represents the id of a resource or it's hierarchical position, e.g. '0' ( following smartTree syntax), or a number that represents the index of a resource.,object resourceObject - An object describing a Gantt Chart resource.
InsertResource	void	object resourceId	Inserts a new resource.
InsertTask	object	object taskObject, object project, int index	Inserts a new task in the timeline. The new task can be inserted as a sub task of a project by passing the appropriate argument for the project id or as a root level item.Args: object taskObject - An object describing a Gantt Chart task.,object project - A number or string that represents the id of a project (e.g. '0') or a project object definition present in the GanttChart. This parameter determines the parent project of the task that will be inserted. If <b>null</b> is passed as an arguemnt the new task will be inserted at root level without a parent project.,int index - The index where the new item should be inserted(e.g. 2). This index will determine the position of the newly inserted task.
InsertTask	object	object taskObject	Inserts a new task in the timeline. The new task can be inserted as a sub task of a project by passing the appropriate argument for the project id or as a root level item.
IsWorkingDay	void	DateTime date	Depending on the nonworkingDays property, returns true or false whether the target date is on a working day or not.Args: DateTime date - A javascript Date object or a string/number which represents a valid JS Date.
LoadState	void	IEnumerable<object> state	Loads a previously saved state of the element or checks LocalStorage for any saved states if no argument is passed to the method.Args: IEnumerable<string> state - An Array containing a valid structure of Gantt Chart tasks.
LoadState	void	N/A	Loads a previously saved state of the element or checks LocalStorage for any saved states if no argument is passed to the method.
OpenWindow	void	object taskId	Opens the popup Window for specific task to edit or to delete a connection if a connection string is passed.Args: object taskId - A string or number that represents the id of a task or the task object that is going to be edited or a connection string(e.g. '2-0-0').
OpenWindow	void	string taskId	Opens the popup Window for specific task to edit or to delete a connection if a connection string is passed.Args: string taskId - A string or number that represents the id of a task or the task object that is going to be edited or a connection string(e.g. '2-0-0').
OpenWindow	void	int taskId	Opens the popup Window for specific task to edit or to delete a connection if a connection string is passed.Args: int taskId - A string or number that represents the id of a task or the task object that is going to be edited or a connection string(e.g. '2-0-0').
Print	void	N/A	Prepares the GanttChart for printing by opening the browser's Print Preview.
Refresh	void	'N/A'	Refreshes the Blazor Component. Performs a layout of the HTML Elements and recalculates the measurements.
Refresh	void	bool fullRefresh	Refereshes the GanttChart after resizing by recalculating the Scrollbars. Args: bool fullRefresh - If set the GanttChart will be re-rendered completely.
Refresh	void	N/A	Refereshes the GanttChart after resizing by recalculating the Scrollbars.
RemoveAllConnections	void	N/A	Removes all connections between tasks.
RemoveConnection	object	object startTaskIndex, int taskEndIndex, int connectionType	Removes a connection between tasks. The function accepts three arguments(task's start index, end index and connection type) or one connection string argument which describes the connection.Args: object startTaskIndex - The index of the start task or the connection string like '2-3-0.,int taskEndIndex - The index of the end task.,int connectionType - The type of the connection. A numeric value from 0 to 3.
RemoveConnection	object	object startTaskIndex	Removes a connection between tasks. The function accepts three arguments(task's start index, end index and connection type) or one connection string argument which describes the connection.
RemoveConnection	object	int startTaskIndex, int taskEndIndex, int connectionType	Removes a connection between tasks. The function accepts three arguments(task's start index, end index and connection type) or one connection string argument which describes the connection.Args: int startTaskIndex - The index of the start task or the connection string like '2-3-0.,int taskEndIndex - The index of the end task.,int connectionType - The type of the connection. A numeric value from 0 to 3.
RemoveConnection	object	int startTaskIndex	Removes a connection between tasks. The function accepts three arguments(task's start index, end index and connection type) or one connection string argument which describes the connection.
RemoveConnection	object	string startTaskIndex, int taskEndIndex, int connectionType	Removes a connection between tasks. The function accepts three arguments(task's start index, end index and connection type) or one connection string argument which describes the connection.Args: string startTaskIndex - The index of the start task or the connection string like '2-3-0.,int taskEndIndex - The index of the end task.,int connectionType - The type of the connection. A numeric value from 0 to 3.
RemoveConnection	object	string startTaskIndex	Removes a connection between tasks. The function accepts three arguments(task's start index, end index and connection type) or one connection string argument which describes the connection.
RemoveResource	void	object resourceId	Removes a resource.Args: object resourceId - A string that represents the id of a resource or it's hierarchical position, e.g. '0' ( following smartTree syntax), or a number that represents the index of a resource.
RemoveResource	void	string resourceId	Removes a resource.Args: string resourceId - A string that represents the id of a resource or it's hierarchical position, e.g. '0' ( following smartTree syntax), or a number that represents the index of a resource.
RemoveResource	void	int resourceId	Removes a resource.Args: int resourceId - A string that represents the id of a resource or it's hierarchical position, e.g. '0' ( following smartTree syntax), or a number that represents the index of a resource.
RemoveTask	void	object taskId	Removes a task from the timeline.Args: object taskId - A number or string that represents the id of a task or the actual item object.
RemoveTask	void	string taskId	Removes a task from the timeline.Args: string taskId - A number or string that represents the id of a task or the actual item object.
RemoveTask	void	int taskId	Removes a task from the timeline.Args: int taskId - A number or string that represents the id of a task or the actual item object.
RemoveTaskConnection	void	object taskStart, object taskEnd	Removes all connections of a task or between two tasks if the second argument is provided and valid.Args: object taskStart - The start task object or it's id.,object taskEnd - The end task object or it's id.
RemoveTaskConnection	void	object taskStart	Removes all connections of a task or between two tasks if the second argument is provided and valid.
RemoveTaskConnection	void	int taskStart, int taskEnd	Removes all connections of a task or between two tasks if the second argument is provided and valid.Args: int taskStart - The start task object or it's id.,int taskEnd - The end task object or it's id.
RemoveTaskConnection	void	int taskStart	Removes all connections of a task or between two tasks if the second argument is provided and valid.
RemoveTaskConnection	void	string taskStart, string taskEnd	Removes all connections of a task or between two tasks if the second argument is provided and valid.Args: string taskStart - The start task object or it's id.,string taskEnd - The end task object or it's id.
RemoveTaskConnection	void	string taskStart	Removes all connections of a task or between two tasks if the second argument is provided and valid.
Render	void	'N/A'	Re-renders the Blazor Component. This method will make a full re-render.
SaveState	void	IEnumerable<object> state	Saves the current settings of the element to LocalStorage. "Requires an id to be set to the element."Args: IEnumerable<string> state - An Array containing a valid structure of Gantt Chart tasks.
SaveState	void	N/A	Saves the current settings of the element to LocalStorage. Requires an id to be set to the element.
SelectResource	void	object id	Allows to select a resource based on it's id.Args: string id - The id of the resource to select.
SelectResource	void	string id	Allows to select a resource based on it's id.Args: string id - The id of the resource to select.
SelectResource	void	int id	Allows to select a resource based on it's id.Args: string id - The id of the resource to select.
SelectTask	void	object id	Allows to select a task based on it's id.Args: string id - The id of the task to select.
SelectTask	void	string id	Allows to select a task based on it's id.Args: string id - The id of the task to select.
SelectTask	void	int id	Allows to select a task based on it's id.Args: string id - The id of the task to select.
SetWorkTime	void	IEnumerable<object> settings	Allows to sets the working days and hours at once.Args: IEnumerable<object> settings - An object definition that contains the days and hours that should be working. The days and hours can be defined as an array of numbers where each number is a day/hour, strings where each string represents a range of days/hours (e.g. '1-5' or '2:00-8:00') or nested array of numbers (e.g. [[1,5]] or [[2, 8]]) which means from 1 to 5 or 2 to 8.
SetWorkTime	void	string settings	Allows to sets the working days and hours at once.Args: string settings - An object definition that contains the days and hours that should be working. The days and hours can be defined as an array of numbers where each number is a day/hour, strings where each string represents a range of days/hours (e.g. '1-5' or '2:00-8:00') or nested array of numbers (e.g. [[1,5]] or [[2, 8]]) which means from 1 to 5 or 2 to 8.
ShowTooltip	void	object target, string content	Shows the tooltip for a specific element.Args: object target - The HTMLElement that will be the target of the tooltip.,string content - Allows to set a custom content for the Tooltip.
ShowTooltip	void	object target	Shows the tooltip for a specific element.
Sort	void	object columns	Sorts the GanttChart tasks/resources if <b>sortable</b> is enabled.Args: object columns - An Array of objects which determine which columns to be sorted, the sort order and the type of item to sort: task or resource. If no arguments are provided sorting will be removed. <br /> An object should have the following properties: <ul><li><b>value</b> - a string that represents the value of a <b>taskColumn</b> to sort.</li><li><b>sortOrder</b> - a string that represents the sorting order for the column: 'asc' (asscending sorting) or 'desc' (descending) are possible values. </li><li><b>type</b> - a string that represents the type of item to sort. This property determines which panel will be sorted. Two possible values: 'task', 'resource'.</li></ul>
StateHasChanged	void	'N/A'	Refreshes the state and Re-renders the Blazor Component, if necessary.
UnselectResource	void	object id	Allows to unselect a resource based on it's id.Args: string id - The id of the resource to unselect.
UnselectResource	void	string id	Allows to unselect a resource based on it's id.Args: string id - The id of the resource to unselect.
UnselectResource	void	int id	Allows to unselect a resource based on it's id.Args: string id - The id of the resource to unselect.
UnselectTask	void	object id	Allows to unselect a task based on it's id.Args: string id - The id of the task to unselect.
UnselectTask	void	string id	Allows to unselect a task based on it's id.Args: string id - The id of the task to unselect.
UnselectTask	void	int id	Allows to unselect a task based on it's id.Args: string id - The id of the task to unselect.
UnsetWorkTime	void	IEnumerable<object> settings	Allows to unset previously set working time. The opposte method for <b>setWorkingTime</b>.Args: IEnumerable<object> settings - An object definition that contains the days and hours that should not be working. The days and hours can be defined as an array of numbers where each number is a day/hour, strings where each string represents a range of days/hours (e.g. '1-5' or '2:00-8:00') or nested array of numbers (e.g. [[1,5]] or [[2, 8]]) which means from 1 to 5 or 2 to 8.
UnsetWorkTime	void	string settings	Allows to unset previously set working time. The opposte method for <b>setWorkingTime</b>.Args: string settings - An object definition that contains the days and hours that should not be working. The days and hours can be defined as an array of numbers where each number is a day/hour, strings where each string represents a range of days/hours (e.g. '1-5' or '2:00-8:00') or nested array of numbers (e.g. [[1,5]] or [[2, 8]]) which means from 1 to 5 or 2 to 8.
UpdateResource	void	object resourceId, object taskObject	Updates an existing resource.Args: object resourceId - A string that represents the id of a resource or it's hierarchical position, e.g. '0' ( following smartTree syntax), or a number that represents the index of a resource.,object taskObject - An object describing a Gantt Chart resource. The properties of this object will be applied to the target resource.
UpdateTask	void	object taskId, object taskObject	Updates a task/project/milestone.Args: object taskId - A number or string that represents the id of a task/project(e.g. '0') or the object definition of the task/project.,object taskObject - An object describing a Gantt Chart task. The properties of this object will be applied to the desired task.

GanttChart Events

Name	Type	Description	Event Detail
OnBeginUpdate	EventCallback<Event>	This event is triggered when a batch update was started after executing the <b>beginUpdate</b> method.	N/A
BeginUpdated	event GanttChartBeginUpdatedEventHandler	This event is triggered when a batch update was started after executing the <b>beginUpdate</b> method.	GanttChartBeginUpdatedEventArgs
OnEndUpdate	EventCallback<Event>	This event is triggered when a batch update was ended from after executing the <b>endUpdate</b> method.	N/A
EndUpdated	event GanttChartEndUpdatedEventHandler	This event is triggered when a batch update was ended from after executing the <b>endUpdate</b> method.	GanttChartEndUpdatedEventArgs
OnConnectionStart	EventCallback<Event>	This event is triggered when the user starts connecting one task to another. This event allows to cancel the operation by calling event.preventDefault() in the event handler function.	dynamic startIndex- The index of the task that a connection is started from.
ConnectionStarted	event GanttChartConnectionStartedEventHandler	This event is triggered when the user starts connecting one task to another. This event allows to cancel the operation by calling event.preventDefault() in the event handler function.	GanttChartConnectionStartedEventArgs
OnConnectionEnd	EventCallback<Event>	This event is triggered when the user completes a connection between two tasks.	string id- The id of the connection that was created., dynamic startTaskId- The id of the task that a connection is started from., dynamic startIndex- The index of the task that a connection is started from., dynamic endIndex- The index of the task that a connection ended to., dynamic endTaskId- The id of the task that a connection ended to., dynamic type- The type of connection. Fours types are available: <ul><li><b>0</b> - start-to-start</li><li><b>1</b> - end-to-start</li><li><b>2</b> - end-to-end</li><li><b>3</b> - start-to-end</li></ul>
ConnectionEnded	event GanttChartConnectionEndedEventHandler	This event is triggered when the user completes a connection between two tasks.	GanttChartConnectionEndedEventArgs
OnChange	EventCallback<Event>	This event is triggered when a Task is selected/unselected.	dynamic value- The index of the new selected task., dynamic oldValue- The index of the previously selected task.
Changed	event GanttChartChangedEventHandler	This event is triggered when a Task is selected/unselected.	GanttChartChangedEventArgs
OnColumnResize	EventCallback<Event>	This event is triggered when a Tree column is resized. Column resizing is controled by the <b>columnResize</b> property.	string dataField- The name of the column. Corresponds to the <b>value</b> attribute of a <b>taskColumns/resourceColumns</b> object., dynamic headerCellElement- The HTMLElement column cell element that was resized., string widthInPercentages- The new width of the column in percentages., string width- The new width of the column in pixels.
ColumnResized	event GanttChartColumnResizedEventHandler	This event is triggered when a Tree column is resized. Column resizing is controled by the <b>columnResize</b> property.	GanttChartColumnResizedEventArgs
OnClosing	EventCallback<Event>	This event is triggered just before the window for task editing or tooltip is closing. The closing operation can be canceled by calling event.preventDefault() in the event handler function.	dynamic owner- The HTMLElement that is the owner of the tooltip. This attribute is defined only when the event is related to the tooltip., dynamic item- The item object that is related to the tooltip owner. It can be a task/segment/resource/indicator object. This attribute is defined only when the event is related to the tooltip., dynamic target- The instance of the window/tooltip that is going to close., dynamic type- The type of window/tooltip that is going to close. There are three types of windows inside GanttChart: <ul><li><b>confirm</b> - a confirm window. This type of window is usually used to confirm the deletion of a task.</li><li><b>task</b> - a window used for task editing.</li><li><b>connection</b> - a window used to delete a connection.</li></ul>. If the event is a tooltip event, there are several tooltip types: <ul><li>indicator - when the tooltip owner is an indicator.</li><li>segment - when the tooltip owner is a task segment.</li><li>task - when the tooltip owner is a task.</li><li>resource - when the tooltip target is a resource.</li></ul>
Closing	event GanttChartClosingEventHandler	This event is triggered just before the window for task editing or tooltip is closing. The closing operation can be canceled by calling event.preventDefault() in the event handler function.	GanttChartClosingEventArgs
OnClose	EventCallback<Event>	This event is triggered when the window for task editing is closed( hidden )	dynamic owner- The HTMLElement that is the owner of the tooltip. This attribute is defined only when the event is related to the tooltip, dynamic item- The item object that is related to the tooltip owner. It can be a task/segment/resource/indicator object. This attribute is defined only when the event is related to the tooltip., dynamic target- The instance of the window/tooltip that is closed., dynamic type- The type of window/tooltip that is closed. There are three types of windows inside GanttChart: <ul><li><b>confirm</b> - a confirm window. This type of window is usually used to confirm the deletion of a task.</li><li><b>task</b> - a window used for task editing.</li><li><b>connection</b> - a window used to delete a connection.</li></ul>. If the event is a tooltip event, there are several tooltip types: <ul><li>indicator - when the tooltip owner is an indicator.</li><li>segment - when the tooltip owner is a task segment.</li><li>task - when the tooltip owner is a task.</li><li>resource - when the tooltip target is a resource.</li></ul>
Closed	event GanttChartClosedEventHandler	This event is triggered when the window for task editing is closed( hidden )	GanttChartClosedEventArgs
OnCollapse	EventCallback<Event>	This event is triggered when an item is collapsed.	dynamic isGroup- A boolean flag indicating whether the collapsed item is a resource group. This is the case when <b>groupByResoruces</b> is enabled., dynamic item- The object details of the collapsed item., int index- The index of the collapsed item., string label- The label of the collapsed item., dynamic value- The value of the collapsed item.
Collapsed	event GanttChartCollapsedEventHandler	This event is triggered when an item is collapsed.	GanttChartCollapsedEventArgs
OnDragStart	EventCallback<Event>	This event is triggered when dragging of a task starts. This event allows to cancel the operation by calling event.preventDefault() in the event handler function.	string id- The id of the task that is going to be dragged., dynamic item- The object of the task that is going to be dragged., dynamic dateStart- The start date of the task that is going to be dragged., dynamic dateEnd- The end date of the task that is going to be dragged., dynamic segment- The segment object that is going to be dragged. This attribute is undefined if a segment is not going to be dragged.
DragStarted	event GanttChartDragStartedEventHandler	This event is triggered when dragging of a task starts. This event allows to cancel the operation by calling event.preventDefault() in the event handler function.	GanttChartDragStartedEventArgs
OnDragEnd	EventCallback<Event>	This event is triggered when dragging of a task finishes.	string id- The id of the task that is was dragged., dynamic item- The object of the task that is was dragged., dynamic dateStart- The start date of the task that is was dragged., dynamic dateEnd- The end date of the task that is was dragged., dynamic segment- The segment object that was dragged. This attribute is undefined if a segment has not been dragged.
DragEnded	event GanttChartDragEndedEventHandler	This event is triggered when dragging of a task finishes.	GanttChartDragEndedEventArgs
OnExpand	EventCallback<Event>	This event is triggered when an item is expanded.	dynamic isGroup- A boolean flag indicating whether the collapsed item is a resource group. This is the case when <b>groupByResoruces</b> is enabled., dynamic item- The index of the expanded item., int index- The index of the expanded item., string label- The label of the expanded item., dynamic value- The value of the expanded item.
Expanded	event GanttChartExpandedEventHandler	This event is triggered when an item is expanded.	GanttChartExpandedEventArgs
OnFilter	EventCallback<Event>	This event is triggered when the GanttChart is filtered.	dynamic type- The type of items that have been filtered ( task or resource )., dynamic action- The name of the filtering action (whether filtering is added or removed)., dynamic filters- The filters that have been applied. Filters represent JQX.Utilities.FilterGroup objects.
Filtered	event GanttChartFilteredEventHandler	This event is triggered when the GanttChart is filtered.	GanttChartFilteredEventArgs
OnItemClick	EventCallback<Event>	This event is triggered when a task, resource or connection is clicked inside the Timeline or the Tree columns.	string id- The id of the task., dynamic item- The item that was clicked. It can be a task, resource or connection., dynamic type- The type of item. Possible values are: 'task', 'project', 'resource', 'connection'., dynamic originalEvent- The original DOM event.
ItemClicked	event GanttChartItemClickedEventHandler	This event is triggered when a task, resource or connection is clicked inside the Timeline or the Tree columns.	GanttChartItemClickedEventArgs
OnItemInsert	EventCallback<Event>	This event is triggered when a Task/Resource/Connection is inserted.	dynamic type- The type of item that has been modified. The type could be: 'connection', 'task', 'project', 'resource'., dynamic item- An object that represents the actual item with it's attributes.
ItemInserted	event GanttChartItemInsertedEventHandler	This event is triggered when a Task/Resource/Connection is inserted.	GanttChartItemInsertedEventArgs
OnItemRemove	EventCallback<Event>	This event is triggered when a Task/Resource/Connection is removed.	string id- The id of the task., dynamic type- The type of item that has been modified. The type could be: 'connection', 'task', 'project', 'resource'., dynamic item- An object that represents the actual item with it's attributes.
ItemRemoved	event GanttChartItemRemovedEventHandler	This event is triggered when a Task/Resource/Connection is removed.	GanttChartItemRemovedEventArgs
OnItemUpdate	EventCallback<Event>	This event is triggered when a Task/Resource/Connection is updated.	string id- The id of the task., dynamic type- The type of item that has been modified. The type could be: 'connection', 'task', 'project', 'resource'., dynamic item- An object that represents the actual item with it's attributes.
ItemUpdated	event GanttChartItemUpdatedEventHandler	This event is triggered when a Task/Resource/Connection is updated.	GanttChartItemUpdatedEventArgs
OnOpening	EventCallback<Event>	This event is triggered just before the window for task editing or tooltip is opening. The opening operation can be canceled by calling event.preventDefault() in the event handler function.	dynamic owner- The HTMLElement that is the owner of the tooltip. This attribute is defined only when the event is related to the tooltip, dynamic item- The item object that is related to the tooltip owner. It can be a task/segment/resource/indicator object. This attribute is defined only when the event is related to the tooltip., dynamic target- The instance of the window/tooltip that is going to open., dynamic type- The type of window/tooltip that is going to open. There are three types of windows inside GanttChart: <ul><li><b>confirm</b> - a confirm window. This type of window is usually used to confirm the deletion of a task.</li><li><b>task</b> - a window used for task editing.</li><li><b>connection</b> - a window used to delete a connection.</li></ul>. If the event is a tooltip event, there are several tooltip types: <ul><li>indicator - when the tooltip owner is an indicator.</li><li>segment - when the tooltip owner is a task segment.</li><li>task - when the tooltip owner is a task.</li><li>resource - when the tooltip target is a resource.</li></ul>
Opening	event GanttChartOpeningEventHandler	This event is triggered just before the window for task editing or tooltip is opening. The opening operation can be canceled by calling event.preventDefault() in the event handler function.	GanttChartOpeningEventArgs
OnOpen	EventCallback<Event>	This event is triggered when the window for task editing is opened( visible ) or when the tooltip is opened.	dynamic owner- The HTMLElement that is the owner of the tooltip. This attribute is defined only when the event is related to the tooltip, dynamic item- The item object that is related to the tooltip owner. It can be a task/segment/resource/indicator object. This attribute is defined only when the event is related to the tooltip., dynamic target- The instance of the window/tooltip that is opened., dynamic type- The type of window/tooltip that is opened. There are three types of windows inside GanttChart: <ul><li><b>confirm</b> - a confirm window. This type of window is usually used to confirm the deletion of a task.</li><li><b>task</b> - a window used for task editing.</li><li><b>connection</b> - a window used to delete a connection.</li></ul>. If the event is a tooltip event, there are several tooltip types: <ul><li>indicator - when the tooltip owner is an indicator.</li><li>segment - when the tooltip owner is a task segment.</li><li>task - when the tooltip owner is a task.</li><li>resource - when the tooltip target is a resource.</li></ul>
Opened	event GanttChartOpenedEventHandler	This event is triggered when the window for task editing is opened( visible ) or when the tooltip is opened.	GanttChartOpenedEventArgs
OnProgressChangeStart	EventCallback<Event>	This event is triggered when the progress of a task bar starts to change as a result of user interaction. This event allows to cancel the operation by calling event.preventDefault() in the event handler function.	string id- The id of the task., int index- The index of the task which progress is going to be changed., dynamic progress- The progress of the task before it is changed.
ProgressChangeStarted	event GanttChartProgressChangeStartedEventHandler	This event is triggered when the progress of a task bar starts to change as a result of user interaction. This event allows to cancel the operation by calling event.preventDefault() in the event handler function.	GanttChartProgressChangeStartedEventArgs
OnProgressChangeEnd	EventCallback<Event>	This event is triggered when the progress of a task is changed.	string id- The id of the task., int index- The index of the task which progress is has been changed., dynamic progress- The progress of the task after it was changed.
ProgressChangeEnded	event GanttChartProgressChangeEndedEventHandler	This event is triggered when the progress of a task is changed.	GanttChartProgressChangeEndedEventArgs
OnResizeStart	EventCallback<Event>	This event is triggered when resizing of a task starts. This event allows to cancel the operation by calling event.preventDefault() in the event handler function.	string id- The id of the task that is going to be resized., dynamic item- The object of the task that is going to be resized., dynamic dateStart- The start date of the task that is going to be resized., dynamic dateEnd- The end date of the task that is going to be resized., dynamic segment- The segment object that is going to be resized. This attribute is undefined if a segment is not going to be resized.
ResizeStarted	event GanttChartResizeStartedEventHandler	This event is triggered when resizing of a task starts. This event allows to cancel the operation by calling event.preventDefault() in the event handler function.	GanttChartResizeStartedEventArgs
OnResizeEnd	EventCallback<Event>	This event is triggered when the resizing of a task finishes.	string id- The id of the task that was resized., dynamic item- The object of the task that was resized., dynamic dateStart- The start date of the task that was resized., dynamic dateEnd- The end date of the task that was resized., dynamic segment- The segment object that was resized. This attribute is undefined if a segment has not been resized.
ResizeEnded	event GanttChartResizeEndedEventHandler	This event is triggered when the resizing of a task finishes.	GanttChartResizeEndedEventArgs
OnSort	EventCallback<Event>	This event is triggered when the GanttChart is sorted by some column.	dynamic type- The type of columns that have been sorted ( task or resource column )., dynamic columns- An array of objects that contains the currently sorted column objects., dynamic sortDataFields- The dataFields of the columns that have been sorted. The dataField corresponds to the <b>value</b> property of a <b>taskColumns/resourceColumns</b> object., dynamic sortOrders- The orders of the columns that have been sorted., dynamic sortDataTypes- The data types of the columns that have been sorted.
Sorted	event GanttChartSortedEventHandler	This event is triggered when the GanttChart is sorted by some column.	GanttChartSortedEventArgs
OnScrollBottomReached	EventCallback<Event>	This event is triggered when the Timeline has been scrolled to the bottom.	N/A
ScrollBottomReached	event GanttChartScrollBottomReachedEventHandler	This event is triggered when the Timeline has been scrolled to the bottom.	GanttChartScrollBottomReachedEventArgs
OnScrollTopReached	EventCallback<Event>	This event is triggered when the Timeline has been scrolled to the top.	N/A
ScrollTopReached	event GanttChartScrollTopReachedEventHandler	This event is triggered when the Timeline has been scrolled to the top.	GanttChartScrollTopReachedEventArgs
OnScrollLeftReached	EventCallback<Event>	This event is triggered when the Timeline has been scrolled to the beginning (horizontally).	N/A
ScrollLeftReached	event GanttChartScrollLeftReachedEventHandler	This event is triggered when the Timeline has been scrolled to the beginning (horizontally).	GanttChartScrollLeftReachedEventArgs
OnScrollRightReached	EventCallback<Event>	This event is triggered when the Timeline has been scrolled to the end (horizontally).	N/A
ScrollRightReached	event GanttChartScrollRightReachedEventHandler	This event is triggered when the Timeline has been scrolled to the end (horizontally).	GanttChartScrollRightReachedEventArgs

Enums

GanttChartDataExportItemType

GanttChartDataExportItemType.Task

GanttChartDataExportItemType.Resource

GanttDayFormat

GanttDayFormat.TwoDigit

GanttDayFormat.Numeric

GanttDayFormat.Long

GanttDayFormat.Short

GanttDayFormat.Narrow

Duration

Duration.Day

Duration.Hour

Duration.Minute

Duration.Second

Duration.Milisecond

HorizontalScrollBarVisibility

HorizontalScrollBarVisibility.Auto

HorizontalScrollBarVisibility.Disabled

HorizontalScrollBarVisibility.Hidden

HorizontalScrollBarVisibility.Visible

HourFormat

HourFormat.Default

HourFormat.TwoDigit

HourFormat.Numeric

MonthFormat

MonthFormat.TwoDigit

MonthFormat.Numeric

MonthFormat.Long

MonthFormat.Short

MonthFormat.Narrow

GanttChartResourceTimelineMode

GanttChartResourceTimelineMode.Diagram

GanttChartResourceTimelineMode.Histogram

GanttChartResourceTimelineMode.Custom

GanttChartResourceTimelineView

GanttChartResourceTimelineView.Hours

GanttChartResourceTimelineView.Tasks

GanttChartResourceTimelineView.Custom

GanttChartSortMode

GanttChartSortMode.None

GanttChartSortMode.One

GanttChartSortMode.Many

GanttChartTaskType

GanttChartTaskType.Project

GanttChartTaskType.Milestone

GanttChartTaskType.Task

VerticalScrollBarVisibility

VerticalScrollBarVisibility.Auto

VerticalScrollBarVisibility.Disabled

VerticalScrollBarVisibility.Hidden

VerticalScrollBarVisibility.Visible

GanttChartView

GanttChartView.Day

GanttChartView.Week

GanttChartView.Month

GanttChartView.Year

YearFormat

YearFormat.TwoDigit

YearFormat.Numeric

WeekFormat

WeekFormat.Long

WeekFormat.Numeric

GanttChartDataExport Properties

Name	Type	Default	Description
ExportFiltered	bool	false	Determines whether to export filtered items or not. By default filtered data is not exported.
FileName	string	"jqxGanttChart"	Sets the exported file's name.
ItemType	GanttChartDataExportItemType	GanttChartDataExportItemType.Task	Determines the type of items that is going to be exported.

GanttChartDateMarker Properties

Name	Type	Default	Description
Label	string	""	Determines the marker label.
Date	object	null	Determines the date for the marker. The date can include time as well.
ClassName	string	""	Allows to add a custom class name to the marker.

GanttChartResourceColumn Properties

Name	Type	Default	Description
Label	string	""	Column's label.
Value	string	""	Column's value. The value shold reference an actual resoruce attribute.
Min	object	0	Column's min size.
Size	object	0	Column's size.

GanttChartTask Properties

Name	Type	Default	Description
Connections	IEnumerable<object>	null	Tasks connection.
Class	string	""	Project, Task or Milestone CSS class.
DateStart	object	""	Project, Task or Milestone start date.
DateEnd	object	""	Project, Task or Milestone end date.
Deadline	object	""	Determines the deadline for the Project, Task or Milestone.
DisableResources	bool	false	Project, Task or Milestone with disabled resources.
DisableDrag	bool	false	Project, Task or Milestone dragging is disabled.
DisableResize	bool	false	Project, Task or Milestone resizing is disabled.
DragProject	bool	true	Project, Task or Milestone drag enabled in the view.
Duration	object	0	The duration of the tasks in miliseconds. The duration unit can be changed via the durationUnit property.
IsExpanded	bool	false	Project, Task or Milestone expanded state in the view.
Hidden	object	false	Task visibility.
Id	string	""	Project, Task or Milestone id.
Indicators	IEnumerable<IGanttChartTaskIndicator>	null	Determines the indicators for the task. Task indicators represent special dates that are displayed inside the task's row.
Label	string	""	Project, Task or Milestone label.
MaxDateStart	object	""	Project, Task or Milestone max start date.
MinDateStart	object	""	Project, Task or Milestone min start date.
MaxDateEnd	object	""	Project, Task or Milestone max end date.
MinDateEnd	object	""	Project, Task or Milestone min end date.
MinDuration	object	0	The minimum duration of the Project, Task or Milestone in miliseconds. The units can be changed via the durationUnit property.
MaxDuration	object	0	The maximum duration of the Project, Task or Milestone in miliseconds. The unit can be changed via the durationUnit property.
Overdue	bool	false	Determines whether the task is overdue it's deadline date or not. The property acts only as a getter. By default it's false, unless there's a deadline defined for the task and the dateEnd has surpassed the deadline date.
Planned	GanttChartTaskPlanned	null	Determines the planned dateStart/dateEnd for as the baseline for the task.
Progress	int	0	Project, Task or Milestone progress.
Resources	IEnumerable<object>	new List<object>()	Project, Task or Milestone resources.
Segments	IEnumerable<IGanttChartTaskSegment>	null	Determines the segments of a task. GanttChart items of type 'task' can be segmented into smaller pieces. This property stores the segment definitions. At least two segments need to be defined in order to segment a task. The first segment should start on the same date as the task. The Last segment should end on the same date as the task.
Synchronized	bool	false	Project, Task or Milestone synchronized in the view.
Tasks	IEnumerable<object>	new List<object>()	Project's tasks. Only projects can have tasks.
Type	GanttChartTaskType	GanttChartTaskType.Task	Project, Task or Milestone type. Possible values are 'project', 'milestone' and 'task'
Value	object	""	Project, Task or Milestone value.

GanttChartTaskIndicator Properties

Name	Type	Default	Description
Label	string	""	Indicator label.
Date	object	""	Indicator date(can include time).
ClassName	string	""	A custom class name that can be applied to the indicator's element in order to apply some styling via CSS.
Icon	string	""	Represents the code for an icon that will be displayed infront of the indicator label inside the timeline.
Tooltip	string	""	Determines the tooltip content for the indicator. By default indicators do not show tooltips when hovered.

GanttChartTaskPlanned Properties

Name	Type	Default	Description
DateStart	object	""	Determines the planned dateStart of the task.
DateEnd	object	""	Determines the planned dateEnd of the task.
Duration	object	0	Determines the planned duration of the task.

GanttChartTaskSegment Properties

Name	Type	Default	Description
Label	string	""	Segment label.
DateStart	object	""	Segment start date.
DateEnd	object	""	Segment end date.
DisableDrag	bool	false	Determines whether segment dragging is disabled.
DisableResize	bool	false	Determines whether segment resizing is disabled.
Duration	object	0	The duration of a segment in miliseconds(unit). The duration unit can be changed via the durationUnit property.

GanttChartTaskColumn Properties

Name	Type	Default	Description
DisableEdit	bool	false	Determines whether the task propery determined by column can be edited from the Window editor or not. By default editing is enabled.
DateFormat	object	null	Applies only to column's that display dates (e.g. dateStart/dateEnd, etc). This property allows to define a JS Intl.DateTimeFormat object in order to format the dates of the column. Here is an example value of the property: dateFormat: { year: '2-digit', month: 'long', day: 'numeric' } . Another option is to use a date format string. Built-in Date formats: // short date pattern 'd' - 'M/d/yyyy', // long date pattern 'D' - 'dddd, MMMM dd, yyyy', // short time pattern 't' - 'h:mm tt', // long time pattern 'T' - 'h:mm:ss tt', // long date, short time pattern 'f' - 'dddd, MMMM dd, yyyy h:mm tt', // long date, long time pattern 'F' - 'dddd, MMMM dd, yyyy h:mm:ss tt', // month/day pattern 'M' - 'MMMM dd', // month/year pattern 'Y' - 'yyyy MMMM', // S is a sortable format that does not vary by culture 'S' - 'yyyy'-'MM'-'dd'T'HH':'mm':'ss' Date format strings: 'd'-the day of the month; 'dd'-the day of the month 'ddd'-the abbreviated name of the day of the week 'dddd'- the full name of the day of the week 'h'-the hour, using a 12-hour clock from 1 to 12 'hh'-the hour, using a 12-hour clock from 01 to 12 'H'-the hour, using a 24-hour clock from 0 to 23 'HH'- the hour, using a 24-hour clock from 00 to 23 'm'-the minute, from 0 through 59 'mm'-the minutes,from 00 though59 'M'- the month, from 1 through 12 'MM'- the month, from 01 through 12 'MMM'-the abbreviated name of the month 'MMMM'-the full name of the month 's'-the second, from 0 through 59 'ss'-the second, from 00 through 59 't'- the first character of the AM/PM designator 'tt'-the AM/PM designator 'y'- the year, from 0 to 99 'yy'- the year, from 00 to 99 'yyy'-the year, with a minimum of three digits 'yyyy'-the year as a four-digit number; 'yyyyy'-the year as a four-digit number.
NumberFormat	object	null	Applies only to column's that display numbers. This property allows to define a JS Intl.NumberFormat object in order to format the numbers of the column. Another option is to use a number format string. Number format strings: 'd' - decimal numbers. 'f' - floating-point numbers. 'n' - integer numbers. 'c' - currency numbers. 'p' - percentage numbers. For adding decimal places to the numbers, add a number after the formatting stri For example: 'c3' displays a number in this format $25.256
Label	string	""	Column's label.
Value	string	""	Column's value.
Size	object	0	Column's size.
MinWidth	object	0	Column's min width.
CustomEditor	object	null	A function that allows to set a custom editor for the column's value in the Editor Window. The function must return an HTMLElement. The function has two arguments: name - the name of the task property that is going to be edited. value - the value of the task property that is going to be edited. It's also important to define a getCustomEditorValue to return the value from the custom editor.
GetCustomEditorValue	object	null	A function that is used in conjunction with customEditor allows to return the value of the custom editor. Since the editor is unknown by the element, this function allows to return the expected result from the editor. It has one argument - an HTMLElement that contains the custom editor that was previously defined by the customEditor function.
SetCustomEditorValue	object	null	A function that is used in conjunction with customEditor allows to set the value of the custom editor. Since the editor is unknown by the element, this function allows to set the expected value to the editor. It has three arguments - editor - an HTMLElement that contains the custom editor that was previously defined by the customEditor function. columnValue - the value property of the column. value - the value of the task property that the column displays(the editor value).

GanttChartTooltip Properties

Name	Type	Default	Description
Arrow	bool	false	Determines whether the tooltip will have an arrow or not.
Delay	int	50	Determines the delay (in miliseconds) before the tooltip is opened.
Enabled	bool	false	Enabled or disables the tooltips.
Offset	int[]	null	Determines the [horizontal, vertical] offset (in pixels) for the tooltip position when opened.

Complex Components

Core Components