Keep selection after changing timeview (day/week/month/year)

[David Stacey]

What's the best way of keeping the selected row in the tree view when the timeview is changed.

i.e. keep the row highlighted when the user clicks on the day/week/month/year tab

[Peter Milchev]

Hello David,

This functionality can be achieved by "persisting" the selected task's data-uid attribute and subscribe once to the dataBound event of the underlying Kendo Gantt widget. 

To achieve that, you can use the OnClientNavigationCommand client-side event with the following event handler declaration:

• https://docs.telerik.com/devtools/aspnet-ajax/controls/gantt/client-side-programming/events/onclientnavigationcommand 
• https://docs.telerik.com/kendo-ui/api/javascript/ui/gantt/methods/select 
• https://docs.telerik.com/kendo-ui/api/javascript/observable/methods/one 

<script>
    function OnClientNavigationCommand(sender, args) {
        var kendoGantt = sender._widget;
        var selected = kendoGantt.select();
        if (selected[0]) {
            var uid = selected[0].getAttribute("data-uid");
            kendoGantt.one("dataBound", function () {
                kendoGantt.select("[data-uid=" + uid + "]")
            })
        }
    }
</script>

Regards,
Peter Milchev
Progress Telerik

[Raju]

Hi Peter,

We have tried the following event

https://docs.telerik.com/devtools/aspnet-ajax/controls/gantt/client-side-programming/events/onclientnavigationcommand

But function OnClientNavigationCommand never get called. 

 

Regards

 

[Peter Milchev]

Hello Raju, 

Please ensure that you are subscribing property to the event, i.e. the value of the OnClientNavigationCommand property of the Gantt is just the name of the handler function, without any parentheses or brackets: https://docs.telerik.com/devtools/aspnet-ajax/getting-started/customize-control-behavior#client-side-event-handling 

Also, please ensure there are no JavaScript errors in the browser's console: https://docs.telerik.com/devtools/aspnet-ajax/knowledge-base/common-general-troubleshooting-javascript-errors