pertrai1
pertrai1

Reputation: 4318

How do I prevent checkbox value changes until later?

Scenario: I have a use case where I have a checkbox, that when clicked will show a modal window with a Save option. What I am focusing on is the checkbox. I need to prevent the checkbox from changing its value or being unchecked until after I take action on the modal popup. Whatever the case, I simply need to know how to prevent the checkbox from not being checked or value changed until a later time.

How can this be accomplished in JavaScript? Again, no uncheck of the checkbox and no value change until a later time - i.e promise resolves. Just need to know about handling the checkbox.

Upvotes: 1

Views: 3014

Answers (1)

Anurag Awasthi
Anurag Awasthi

Reputation: 6233

Create a checkbox and use ng-change event to handle the unchecking of checkbox,

<input type="checkbox" ng-model = "checkboxValue" ng-change="handleChange()" />

And add this logic in your controller,

app.controller("MainCtrl", function($scope){
  $scope.checkboxValue = true;

  let canUncheck = false;

  $scope.handleChange = function(){
    if(!canUncheck && !$scope.checkboxValue){
      $scope.checkboxValue = true;
    }
  }


  //later when checkbox can be unchecked
  canUncheck = true;$scope.checkboxValue = false;
})

See this pen.

Upvotes: 1

Related Questions