vendredi 9 juin 2017

Show a message when checking a checkbox and show another message when unchecking it

I'm fairly new in Javascript/AngularJS and want to play around with it to learn/understand these languages. On the Angular website there's a little basic to do list script I want to change a little. I've changed it into a checklist of things I need to learn. When i check the checkbox I got a little msg like, 'well done!'. But when I uncheck it, the same msg pops up and that I want to change in something like, 'you sure?'.

I've spent several hours on looking for the answer but couldn't find the answer so I hope someone can help me figuring out how to do this. This is my code:

HTML:

      <div ng-controller="TodoListController as todoList">
        <span>Nog  van de  te gaan!</span>
        <!--[ <a href="" ng-click="todoList.archive()">archive</a> ]-->
        <ul class="unstyled">
          <li ng-repeat="todo in todoList.todos">
            <label class="checkbox">
              <input type="checkbox" onclick="alert('Well done!')" ng-model="todo.done">
              <span class="done-"></span>
            </label>
          </li>
        </ul>
      </div> <!--einde ng-controller -->

AngularJS code:

todoList.remaining = function() {
  var count = 0;
  angular.forEach(todoList.todos, function(todo) {
    count += todo.done ? 0 : 1;
  });
  return count;
};

todoList.archive = function() {
  var oldTodos = todoList.todos;
  todoList.todos = [];
  angular.forEach(oldTodos, function(todo) {
    if (!todo.done) todoList.todos.push(todo);
  });
};

If there's missing something, let me know! Thanks in advance!




Aucun commentaire:

Enregistrer un commentaire