When I click button "on" my API run xhr to "activate" my data. But when I click button "off" my API run XHR to "deactive" my data.isactive I got from data API(0 or 1). Therefore, I use _
ng-show and ng-hide
I did show my button "off" or "on" to show if my isactive === 1 or isactive === 0.
I used this code HTML :
<button ng-show="data.active" type="button" class="btn btn-default" ng-click="FiturThread(data)"><i class="fa fa-toggle-off"></i> Off</button>
<button ng-hide="data.active" type="button" class="btn btn-success" ng-click="FiturThread(data)"><i class="fa fa-toggle-on"></i> On</button>
My problem is i clicked button "on" and alert run "Success Active" , button "on" should be replaced with button "off", so instead.
Can you give me solution ? I had to use what ? Thank you
Here is the working example
Try this
<!DOCTYPE html>
<html lang="en">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js">
</script>
<body>
<div ng-app="myApp" ng-controller="myCtrl">
<button ng-show="data.active" ng-click="FiturThread(data)">First Button</button>
<button ng-hide="data.active" ng-click="FiturThread(data)">Second Button</button>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.data = {};
$scope.data.active = true;
$scope.FiturThread = function(){
$scope.data.active = !$scope.data.active;
}
});
</script>
</body>
</html>