Facing Issues In Notification using Angularjs on click of the button

Question

I am new to angularjs and UI dev too and I have tried to implement a functionality of disabling the button on-click of it and showing a message on page e.g "In progress" and after 3 secs button should get enabled with a different message e.g "Completed".

Button is getting disabled on click but and not showing notification "In Progress"on-click instead showing notification "Complete"after 3 secs.

I have seen this similar kind of problem solved before in this forum but not able to figure out missing logic in my code ............kindly please help

MY HTML:

Analysis

In Progress

Complete

Controller:

  $scope.isDisabled=false;
  $scope.showNotification=false;
  $scope.isEnabled=true;
  $scope.completeNotification=false; 

  $scope.showNext=function(){

       $scope.isDisabled=true;
       $scope.showNotification=true;
       $scope.buttonWait();



$scope.buttonWait = function() {
    $timeout($scope.isEnabled = true, $scope.showNotification = false, $scope.completeNotification = true, 3000);
}

Adding again html part::<div> <button class="btn btn-success btn-circle btn-xl" style="margin-bottom:4px;white-space: normal;" data-ng-click="showNextWidget();" ng-disabled="isDisabled">Analysis </button> <p class="notification-btn" ng-show="showNotification">System has started to explore the input data. Please wait until further notification!</p> <p class="notification-btn-complete" ng-hide="showNotification" ng-show="completeNotification" ng-disabled="isEnabled">Please continue with the next process!</p> </div> — Hazell
– Hazell, Commented Aug 15, 2016 at 8:21
Please update the question with the code you wrote in comment. Can't read here — Umair Farooq
– Umair Farooq, Commented Aug 15, 2016 at 8:23

Mikko Viitala · Accepted Answer · 2016-08-15 08:32:00Z

1

$timeout(function() {
  $scope.isEnabled = true;
  // ...
}, 3000);

answered Aug 15, 2016 at 8:32

Mikko Viitala

8,3944 gold badges42 silver badges62 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

ismail baig · Accepted Answer · 2016-08-15 08:50:48Z

0

as mentioned by Mikko, your syntax seems to be wrong. it should be like

$scope.buttonWait = function() {
 $timeout(function() { 
   $scope.isEnabled = true, 
   $scope.showNotification = false, 
   $scope.completeNotification = true
  }), 3000);
};

sample plnkr link here

edited Aug 15, 2016 at 8:50

answered Aug 15, 2016 at 8:41

ismail baig

8912 gold badges12 silver badges42 bronze badges

Collectives™ on Stack Overflow

Facing Issues In Notification using Angularjs on click of the button

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related