Reset checkboxes in Ionic modal

I am building my first iOS app or HTML5/iOS app with the Ionic framework. Now my app has a list of items, and each item has a modal dialog attached to it that displays a bunch of properties attached to the item. These properties can be in an on/off state, so they are presented as checkboxes, so the user can modify their state. The state of the properties are independent of the similar properties on other items, so what was the problem I faced? So let’s talk about how-to reset checkboxes in Ionic modal dialog.

Problem

Ok so lets look at the Ionic tabs sample app, that we can get once we run the following command

ionic start resetModal tabs

So amongst other things, it gives us a tab for chats, that looks something like this

Chats

Ok so lets say there was this feature that on swiping left, it would revel a modal dialog (IonicModal) that contains a list of days (checkboxes) that you can select to set the availability for each chat contact. So when you swipe left on each contact, it should present the modal dialog in it’s pristine state i.e. none of the checkboxes selected.

Reset checkboxes in Ionic

$scope.closeModal = function(){
  $scope.testModal.hide();
}

$scope.closeModal = function(){
  $scope.testModal.remove();
}

$scope.openModal = function(item) {
  var modalOptions = {scope:$scope, animation: 'slide-in-up'};
  $ionicModal.fromTemplateUrl('templates/availability.html', modalOptions).then(function(dialog) {
        $scope.testModal = dialog;
        $scope.testModal.show();
    });
}

Conclusion

As usual, if you find any of my posts useful support me by  buying or even trying one of my apps on the App Store. 

https://mydaytodo.com/apps/

Also, if you can leave a review on the App Store or Google Play Store, that would help too.