Chanaka Amarasinghe
Chanaka Amarasinghe

Reputation: 3778

How to get input checkbox (change) event value on and off?

The result always coming as "on". I want to make it get two results when on and off.

  <label class="switch switch-3d switch-primary switch-success">
    <input type="checkbox" (change)="isChangeLimitAccessToggle($event.target.value)" id="ifLimitAccess" class="switch-input">
    <!-- [attr.disabled]="switchDisable?'':null"  [checked]="switchEnable" -->
    <span class="switch-label" data-on="Yes" data-off="No"></span>
    <span class="switch-handle"></span>
  </label>

Upvotes: 8

Views: 26417

Answers (3)

Nagender Pratap Chauhan
Nagender Pratap Chauhan

Reputation: 2204

<input type="checkbox" value = "1"(change)="isChangeLimitAccessToggle($event.target.value)"  class="switch-input">

you can pass value in input tag and when you will click on check box then you get 1 value so it will work for you.

Upvotes: 0

Azamat Zorkanov
Azamat Zorkanov

Reputation: 819

Just use checked attribute:

<input type="checkbox" (change)="isChangeLimitAccessToggle($event.target.checked ? 'on' : 'off')" id="ifLimitAccess" class="switch-input">

Upvotes: 15

Michael Desigaud
Michael Desigaud

Reputation: 2135

Add the [(ngModel)] directive to your input:

<label class="switch switch-3d switch-primary switch-success">
<input type="checkbox" [(ngModel)]="checkboxValue"(change)="isChangeLimitAccessToggle(checkboxValue)" id="ifLimitAccess" class="switch-input">
<!-- [attr.disabled]="switchDisable?'':null"  [checked]="switchEnable" -->
<span class="switch-label" data-on="Yes" data-off="No"></span>
<span class="switch-handle"></span>

Upvotes: 2

Related Questions