This is a migrated thread and some comments may be shown as answers.

How to select Task In Gantt Tree list JS

2 Answers 72 Views
Gantt
This is a migrated thread and some comments may be shown as answers.
Igor
Top achievements
Rank 1
Igor asked on 18 Mar 2020, 06:17 PM

Hello,

I need to select Tree list row by javascript.
So far I found this code:

function selectTask(tsk){
         var gantt = $find("<%= RadGantt1.ClientID%>");
         gantt._widget.select("tr:eq(" + tsk.get_id() + ")");
     }

 

But this does not work well. It works only in some cases, sometimes it selects the wrong row or nothing at all.
Can you help me?
Thank you.

2 Answers, 1 is accepted

Sort by
0
Accepted
Peter Milchev
Telerik team
answered on 23 Mar 2020, 03:34 PM

Hello Igor,

One easy way to select a task is to programmatically click it:

tsk.get_element().click();

If you would like to use the .select method of the underlying Kendo UI Gantt, you can use this approach:

gantt._widget.select("tr[data-uid="+tsk._uid+"]")

Regards,
Peter Milchev
Progress Telerik

Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
Our thoughts here at Progress are with those affected by the outbreak.
Fit2Page
Top achievements
Rank 2
Iron
Iron
Veteran
commented on 03 Aug 2022, 09:47 AM

Would it be possible to select a task once the page has loaded? I want to create a kind of Task shortcut.

Since the data-uid are changing with every pageload I cannot do it with JS.

 

Marc

Peter Milchev
Telerik team
commented on 05 Aug 2022, 12:35 PM

Hi Marc, you can save the ID of the task you want to select in a hidden field. When the page loads on the client-side, you can find the task that has the same ID as the one in the hidden field.

     

    <asp:HiddenField runat="server" ID="HiddenField1" />
    <script>
        function OnClientLoad(sender, args) {
            var hf = $get("<%= HiddenField1.ClientID %>");
            var id = hf.value;
            if (id) {
                var kendoGantt = sender.get_kendoWidget();
                var tasks = sender.get_allTasks();
                for (var i = 0; i < tasks.length; i++) {
                    var task = tasks[i];
                    if (task.get_id() == id) {
                        sender.get_kendoWidget().select("[data-uid=" + task._uid + "]")
                        break;
                    }
                }
            }
        }
        function OnClientTaskSelectionChanged(sender, args) {
            var hf = $get("<%= HiddenField1.ClientID %>");
            hf.value = args.get_sender().dataItem(args.get_selectedElement()).id;
        }
    </script>

    Optionally, you can persist the selection by setting the ID in the onClientTaskSelectionChanged event as demonstrated in the snippet above.

    Fit2Page
    Top achievements
    Rank 2
    Iron
    Iron
    Veteran
    commented on 09 Aug 2022, 06:11 AM

    Hi Peter,

     

    I am afraid this is not going to work because I want to jump into the Gantt chart with a selected Task from an external link. I only have the Task ID from the database as a parameter in the URL querystring.

    Marc

    Rumen
    Telerik team
    commented on 11 Aug 2022, 12:14 PM

    Why don't you obtain the Task ID from the URL querystring with a client script as shown in the examples provided at StackOverflow discussion: How can I get query string values in JavaScript?.This way you will be able to supply it as a task._uid in the line below from Peter's solution:

    sender.get_kendoWidget().select("[data-uid=" + querystringTaskID + "]")
    Fit2Page
    Top achievements
    Rank 2
    Iron
    Iron
    Veteran
    commented on 12 Aug 2022, 05:42 AM

    Hi Rumen,

     

    That is because I come in with a querystring xxxx.aspx?taskid=5

    And the data-uid in the source and your scripts is something like gdde08e6-53d8-4ec3-b673-22215c294a4a

    I have no correlation...so how can this be done?

     

    Marc

    Peter Milchev
    Telerik team
    commented on 16 Aug 2022, 09:08 AM

    Hi Marc,

    There is a difference between id and uid. 

    What we actually tried to explain is how to use the id to find the task object. Once you get the task object, you will be able to get the uid.

    For example, check the for loop over all tasks, and see how the task is found by the get_id() and then the ._uid property is used for the selector:

                var tasks = sender.get_allTasks();
                for (var i = 0; i < tasks.length; i++) {
                    var task = tasks[i];
    // here "id" is the task ID you would get from the query stringif (task.get_id() == id) { sender.get_kendoWidget().select("[data-uid=" + task._uid + "]") break; } }

    Also, if you are using the query string to pass the ID, you can skip all server-side logic and just get the query string inside the OnClientLoad and use it. Here are some links that could help you with getting the query params:

     

    Fit2Page
    Top achievements
    Rank 2
    Iron
    Iron
    Veteran
    commented on 16 Aug 2022, 10:04 AM

    Wow, this is really cool, it works.

    Sorry for my misunderstanding & thanks for your patience!

     

    Marc

    0
    Igor
    Top achievements
    Rank 1
    answered on 24 Mar 2020, 10:51 AM
    Thank you.
    Tags
    Gantt
    Asked by
    Igor
    Top achievements
    Rank 1
    Answers by
    Peter Milchev
    Telerik team
    Igor
    Top achievements
    Rank 1
    Share this question
    or