We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: June 24, 2019).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Stop event action on drag and task edit.Perform customized action on drag ,task edit .

Thread ID:

Created:

Updated:

Platform:

Replies:

146587 Aug 9,2019 07:19 AM UTC Aug 12,2019 11:41 AM UTC React - EJ 2 1
loading
Tags: Gantt Chart
Sudhanshu Jain
Asked On August 9, 2019 01:19 PM UTC

1.How can we stop taskbar duration update .Task duration should not be increase or decrease .???We want to only drag the task. 

2. How can we fire customized action on double click on task bar .which event we can use for that ????

3.How can we fire customized action on dependency mapping .which event we can use for that ????

4.How can we fire customized action on task drag  .which event we can use for that ????

5.Which event is fired when we click on the task bar only ????


Pooja Priya Krishna Moorthy [Syncfusion]
Replied On August 12, 2019 11:41 AM UTC

Hi Sudhanshu, 
 
Thanks for using our essential JS2 products. 
Please find the below response. 
No 
Queries 
Syncfusion Comments 
 
1 
 
 
How can we stop taskbar duration update. Task duration should not be increase or decrease .???We want to only drag the task.  
 
 
By using taskbarediting event we can restrict the duration update on resizing. We can set args.cancel as true when taskbarEditAction is LeftResizing or RightResizing. 
We can also hide taskbar resizing element by over-riding the CSS. 
Please find the below code example. 
 
<style> 
      .e-gantt-chart .e-taskbar-right-resizer.e-icon.e-right-resize-gripper, 
      .e-gantt-chart .e-taskbar-left-resizer.e-icon.e-left-resize-gripper 
      { 
        display: none; 
      } 
</style> 
        export class Editing extends SampleBase { 
            //... 
            taskbarEditing(args) { 
                if (args.taskBarEditAction == "LeftResizing" || args.taskBarEditAction == "RightResizing") { 
                    args.cancel = true 
                } 
            } 
            render() { 
                return (<div className='control-pane'> 
                 <GanttComponent id='Editing' dataSource={editingData} 
                            taskbarEditing={this.taskbarEditing.bind(this)}> 
                        //... 
                        </GanttComponent> 
                </div>); 
            } 
        } 
 
 
 
2 
 
 
How can we fire customized action on double click on task bar .which event we can use for that ???? 
 
 
actionBegin event gets triggered on double click of a record. Using this event with requestType beforeOpenEditDialog we can perform some custom actions. Please find the code example below. 
 
 
export class Editing extends SampleBase { 
            //... 
         actionBegin(args) { 
              if(args.requestType == "beforeOpenEditDialog") { 
                      //... custom action goes here 
                } 
            }   
          render() { 
                return (<div className='control-pane'> 
                    <GanttComponent id='Editing' dataSource={editingData} 
                            actionBegin ={this.actionBegin.bind(this)}> 
                        //... 
                        </GanttComponent> 
                </div>); 
            } 
        } 
 
 
 
3 
 
 
How can we fire customized action on dependency mapping which event we can use for that? 
 
 
While drawing connector lines, taskbarediting event gets triggered with taskbarEditAction ConnectorPointRightDrag, ConnectorPointLeftDrag. After connector lines are drawn actionComplete event gets triggered with requestType save. 
 
4 
 
 
How can we fire customized action on task drag. Which event we can use for that? 
 
 
taskbarediting event gets triggered with different taskbarEditAction like ParentDrag, ChildDrag, MilestoneDrag while dragging parent task, child task, milestone task respectively. 
 
 
5 
 
 
Which event is fired when we click on the task bar only ???? 
 
Currently we don’t have any event for taskbarClick action. But we logged a feature request for this and you can track its status from below feedback link. 
This feature will be implemented and included in any of our upcoming releases. Please cast your to make it count. We will prioritize the features for every release based on demands. 
 
Currently we can achieve this by some work-around. We can manually bind the click event using javascript addEventListener method. Please find the code example below. 
 
 
export class Editing extends SampleBase { 
            //... 
         dataBound(args) { 
          var taskbar = document.getElementsByClassName('e-taskbar-main-container'); 
             for (var i=0;i<taskbar.length;i++){ 
                taskbar[i].addEventListener('click', function () { 
                    //... 
          }); 
             } 
           }   
          render() { 
                return (<div className='control-pane'> 
                        <GanttComponent id='Editing' dataSource={editingData} 
                            dataBound ={this.dataBound.bind(this)}> 
                        //... 
                        </GanttComponent> 
                 </div>); 
            } 
        } 
 
 
Please find the below sample link.  
 
Regards, 
Pooja Priya K 
 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon