CODEWITHSUNDEEP
javascriptangularjs
Kapil Soni
Kapil Soni

Reputation: 1051

How to prevent multiple time click on anchor tag in AngularJS?

I have created sharing functionality it will be work but 

//HERE WE CREATE THE CONTOLLER FOR SHARING
$scope.selectedSharedBuyerKeyList     = [];
$scope.selectedSharedBuyerObjectList  = [];
$scope.productObjectForShareModal     = [];

$scope.getConnectedSharedUser         = function(product) {
$scope.productObjectForShareModal = product;
var data = {
  productKeyId : $scope.productObjectForShareModal.keyId
}

//Call the getSharedUserList function for get the detail of the shared connectedUsers
SellerDashboardService.getSharedUserList(function(response) {				
    if(response != null) {
      if (response.data.isProduct) {
        $scope.selectedSharedBuyerKeyList = response.data.sellerProductsDto;

        // Obtaining user object..
        $scope.selectedSharedBuyerObjectList = [];
        for(var selectedSharedBuyerKey of $scope.selectedSharedBuyerKeyList) {
          var data = selectedSharedBuyerKey;
          //call the getBuyerInShared for get the list of the objects 
          SellerDashboardService.getBuyerInShared(function(response) {
            if(response != null) {
              if (response.data.isbuyer) {
                var buyerObject = response.data.isbuyer;
                $scope.selectedSharedBuyerObjectList.push(buyerObject);
              }
            }
          },data);
        }
      }
    }
},data);
}
<a href="#" class="fa fa fa-group btn btn-xs pull-left bg-color-d4"
    data-toggle="modal" data-target="#groupModal" 
  ng-click="getConnectedSharedUser(productDBList)">
</a>

list is repeated after multiple time click on the a tag and user list is repeated again and again.so tell me how to resolve the repeatation problem?

Upvotes: 1

Views: 78

Answers (2)

yogesh rathod
yogesh rathod

Reputation: 310

What I did in angular 2 is I have Disabled the button on the first click.

E.g.

<button (click)="someFunction()" [disabled]="disableButton"></button>
someFunction() {
      disableButton = true;
}

Note: Syntax would be different in your case but logic will be same. I hope this will help.

Upvotes: 1

Samuel James
Samuel James

Reputation: 1536

Try this

$scope.selectedSharedBuyerObjectList  = [];
$scope.productObjectForShareModal     = [];

$scope.cliked=false ///set click to false



$scope.getConnectedSharedUser         = function(product) {
$scope.productObjectForShareModal = product;
var data = {
  productKeyId : $scope.productObjectForShareModal.keyId
}

//Call the getSharedUserList function for get the detail of the shared connectedUsers
SellerDashboardService.getSharedUserList(function(response) {               
$scope.clicked =true;  ///set it back to true
    if(response != null) {
      if (response.data.isProduct) {
        $scope.selectedSharedBuyerKeyList = response.data.sellerProductsDto;

        // Obtaining user object..
        $scope.selectedSharedBuyerObjectList = [];
        for(var selectedSharedBuyerKey of $scope.selectedSharedBuyerKeyList) {
          var data = selectedSharedBuyerKey;
          //call the getBuyerInShared for get the list of the objects 
          SellerDashboardService.getBuyerInShared(function(response) {
            if(response != null) {
              if (response.data.isbuyer) {
                var buyerObject = response.data.isbuyer;
                $scope.selectedSharedBuyerObjectList.push(buyerObject);
              }
            }
          },data);
        }
      }
    }
},data);
}



<a href="#" class="fa fa fa-group btn btn-xs pull-left bg-color-d4"
    data-toggle="modal" ng-disabled="cliked" data-target="#groupModal" 
  ng-click="getConnectedSharedUser(productDBList)">
</a>

Upvotes: 1

Related Questions