how to add image on checkbox using ngclass ..?

Question

could you please tell me how to add checkbox image using ng-class in angular js Actually when user click option it show the checkbox image and when user select again same element it unselect the checkbox or remove the checkbox image how I will achieve this using ng-class

here is my plunker : http://plnkr.co/edit/fHdnWwIRgi5jFLQlCWKs?p=preview

I need check box on right side which I am able to do but I need to use background image of checkbox ("green one") instead of default one.In image it is display ar blue I need green which is given in css

.backgrounfimageset{
    background-image:url('http://icons.iconarchive.com/icons/visualpharm/must-have/256/Check-icon.png');
  }
 .liposition{
   position:relative;
 }
 .checkboxposiion{
   position:absolute!important;
   right:10px;
 }

could you please tell me how I will do this ?

Shruti
– Shruti

2015-06-16 15:58:45 +00:00
Commented Jun 16, 2015 at 15:58 — Shruti
– Shruti, Commented Jun 16, 2015 at 15:58

Balaji Marimuthu · Accepted Answer · 2015-06-16 17:33:41Z

1

the ng-class reference is correct for add the image, but need to be override the default css like as below.

<style>
.backgrounfimageset{
    background-image:url('http://icons.iconarchive.com/icons/visualpharm/must-have/256/Check-icon.png') !important;
    background-size: cover !important;
  }
   .backgrounfimageset:before{
     background-color: inherit !important;
  border-radius: 0px !important;
  border-style: none !important;
   }
</style>

and if you unselect the checkbox, don't want to be display the checkbox you need to override the .checkbox input css.

answered Jun 16, 2015 at 17:33

Balaji Marimuthu

2,06814 silver badges14 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

how to add image on checkbox using ngclass ..?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related