As I work on developing a web application, my goal is to have a page displaying a list of users and another page containing a form for each user with three buttons. One of these buttons, the confirm button, should allow the user to be removed from the list upon being clicked. Despite implementing this functionality, I am encountering an issue where the confirm button does not seem to be working as intended.
Let's take a look at the code snippet below:
<div ng-controller="MyCtrl">
<div ng-repeat="person in userInfo.users | filter : {id: userId}">
<a class="back" href="#/user">Back</a>
<button type="button" class="edit" ng-show="inactive" ng-click="inactive = !inactive">
Edit
</button>
<button type="submit" class="submit" ng-show="!inactive" ng-click="inactive = !inactive">Save</button>
<a class="delete" ng-click="confirmClick() && confirmedAction()" confirm-click>Confirm</a>
<div class="people-view">
<h2 class="name">{{person.firstName}}</h2>
<h2 class="name">{{person.lastName}}</h2>
<span class="title">{{person.email}}</span>
<span class="date">{{person.website}} </span>
</div>
<div class="list-view">
<form>
<fieldset ng-disabled="inactive">
<legend>Basic Info</legend>
<b>First Name:</b>
<input type="text" ng-model="person.firstName">
<br>
<b>Last Name:</b>
<input type="text" ng-model="person.lastName">
<br>
<b>Email:</b>
<input type="email" ng-model="person.email">
<br>
</fieldset>
</form>
</div>
</div>
</div>
Here is the related code from App.js:
var app = angular.module("UserPortal", ['ngRoute', 'ui.bootstrap' ]);
app.controller('MyCtrl', function($scope) {
$scope.inactive = true;
$scope.confirmedAction = function() {
isConfirmed.splice($scope.person.id, 1);
location.href = '#/user';
}
});
app.directive('confirmClick', ['$q', 'dialogModal', function($q,
dialogModal) {
// directive logic here...
}])
// Additional code for Modal confirmation dialog window and other app configurations
});
Now let's examine the HomeController script:
var isConfirmed = false;
app.controller('HomeController', function($scope, people, $http) {
if (!isConfirmed) {
// code logic here...
}
});