CODEWITHSUNDEEP
javascriptangularjsangularjs-directive
subi_speedrunner
subi_speedrunner

Reputation: 921

Handle cell click event on Angular Gantt

I am trying to customize the behaviour of Angular Gantt.

On cell click : I have to get the current cell value & corresponding header value.

I gone thru the documentation present in this url : https://angular-gantt.readthedocs.io/en/latest/ but couldn't get the required event.

Is there any event present to achieve this functionality. Any help is much appreciated.

I tried following code

 mainApp.controller("TestController", function ($scope, TestService) {   
     $scope.registerApi = function (api) {
     api.tasks.on.change($scope, onTaskChange); //working

     //TO handle the cell click & corresponding header value
     api.core.getDateByPosition($scope, getHeader)

     //api.core.on.ready($scope, getDateByPosition) //not working
     //api.core.on.rendered($scope, getDateByPosition) //not working

    }

    var onTaskChange = function (selected) {
       $scope.currCell = selected.model;
       console.log("onTaskChange: " + selected.model.name);
            };

    var getHeader= function (getHeader) {
          // I should get the current clicked cell header value. But getting error
            };    
    }

Upvotes: 1

Views: 1652

Answers (1)

subi_speedrunner
subi_speedrunner

Reputation: 921

Answering my own question as someone may find it useful.

I am able to achieve this from this link
https://angular-gantt.readthedocs.io/en/latest/configuration/customize/

Following is the code which I used:

$scope.registerApi = function (api) { 
    api.directives.on.new($scope, function (dName, dScope, dElement, dAttrs, dController) {
                if (dName === 'ganttTask') {                    
                    dElement.bind('click', function (event) {
                        debugger;
                        $scope.RowName1 = dScope.task.row.model;
                        $scope.currentTask = dScope.task.model;
                    });
                }
                else if (dName === 'ganttRow')
                {
                    dElement.bind('click', function (event) {
                        debugger;
                        $scope.RowName = dScope.row.model.name;
                        $scope.Header = api.core.getDateByPosition(event.offsetX, true)
                    });
                }               
            });

Upvotes: 3

Related Questions