How to access and add methods when time/date headers are clicked.
Edward-Ta opened this issue · comments
I have a function that I run everytime the gantt chart updates that changes css within it, I trigger this updateCss function within my updating tasks functions but I'm not sure how to access the header column functions to trigger it when, lets say, a user clicks 'Tuesday 15th'.
Is there a hook or something similar for header selection?
e.g.:
Clicking on 'Wednesday 16th' I want to call my updateCss() function after its execution.
There isn't an API endpoint per say, but you can implement it yourself, example below
ColumnHeaderRow.svelte
<div class="column-header-cell" on:click="{() => dispatch('dateSelected', { from: header.from, to: header.to, unit: header.unit })}"></div>
ColumnHeader.svelte
<ColumnHeaderRow {header} baseWidth={baseHeaderWidth} baseDuration={baseHeaderDuration} on:dateSelected/>
Gantt.svelte
<ColumnHeader {headers} {columnUnit} {columnOffset} on:dateSelected="{onDateSelected}"/>
function onDateSelected(event) { // YOUR CODE }
I cloned this repo then changed the onDateSelected function in Gantt.svelte like @V-Py said.
Found out how to get this newly rolledup cloned repo into my project by including this into the package.json file:
"svelte-gantt": "../components/svelte-gantt/dist"
And you actually fixed some other problems also by suggesting this, ahahha.
Thank you @V-Py.