#102182
YavorDashev
Member

Hi Maserati,
By default the GanttChart doesn’t support single selection, but I have created a JavaScript workaround for your scenario which enables you to have such functionality.
JavaScript part:

   const ganttChart = document.querySelector('smart-gantt-chart');
    let selectedTasks;
    ganttChart.addEventListener('change', (event) => {
        selectedTasks= ganttChart.getSelectedTasks();
        if ( selectedTasks.length >= 1 ) {
            ganttChart.classList.add('disabled-selection');
        }
        else {
            ganttChart.classList.remove('disabled-selection');
        }
    });

Also some necessary CSS:

.smart-gantt-chart.disabled-selection .smart-table-select-row{
    pointer-events: none;
}
.smart-gantt-chart.disabled-selection .smart-table-select-row.selected {
    pointer-events: initial;
}

Let me know if that works for you!
Please, do not hesitate to contact us if you have any additional questions.
Best regards,
Yavor Dashev
Smart UI Team
https://www.htmlelements.com/