mercredi 10 janvier 2018

How to print only selected items (selected with a checkbox) in AngularJS

I've made two tables, and I added one checkbox for each.

picture

The checkboxes aren't default checkbox, but it's an image that gets changed on click, here the code:

<button class="btn btn-lg btn-customPrint-md no-print" ng-click="checkBoxPrint2 = !checkBoxPrint2"><i class="fa fa-1x" ng-class="checkBoxPrint2 ? 'fa-square-o' : 'fa-check-square-o'"></i></button>

so onClick it changes the FontAwesome icon.

Then I have a Print Button, which prints the page following the print css rules:

 <button class="btn btn-lg btn-custom-md pull-right" ng-click="vm.$window.print()"><i class="fa fa-print fa-2x"></i></button>

Now I would like to know how can I make it print ONLY the tables that have the checkbox checked (meaning with "fa-check-square-o" icon) ? My initial idea was doing it with ng-class, so when the button is pushed, it gives a "noPrint" class to the element that hides it from print, does it make sense?




Aucun commentaire:

Enregistrer un commentaire