Ionic 2- how to get checkbox selected values inside variable/array on button click?

Question

I have gridview in which I have a list of email ids. I want to get checkbox selected email ids in an array or a variable on button click. I'm new to this technology, Please help.

Here is my sendmail.html code:

<div>
<ion-grid>
  <ion-row wrap class="gridHeading">
    <ion-col col-2 class="gridHeading" align="center"></ion-col>
    <ion-col col-10 class="gridHeading" align="center">CLIENT EMAIL</ion-col>
  </ion-row>
  <ion-row wrap *ngFor="let mail of custEmailIDs" class="gridCol">
    <ion-col col-2 class="gridCol"><ion-checkbox [(ngModel)]="mail.checked"></ion-checkbox></ion-col>
    <ion-col col-10 class="gridCol">{{ mail.Email_ID }}</ion-col>
  </ion-row>
</ion-grid>

<button
ion-button
full
color="other">Send</button>

also tell me what and how to bind values to checkbox so that I can get those email ids on button click. Thanks in advance.

Your code is already working just try {{custEmailIDs | json}} you can understand — Paresh Gami
– Paresh Gami, Commented Jan 12, 2018 at 8:23
When you click on checkbox you can see json is updated. You can see checked key is updated in json — Paresh Gami
– Paresh Gami, Commented Jan 12, 2018 at 8:27
Where to write this "{{custEmailIDs | json}}" and what should I write on button click to get email ids in .ts file? — Shreyas Pednekar
– Shreyas Pednekar, Commented Jan 12, 2018 at 9:04

Mahi Parmar · Accepted Answer · 2018-01-16 10:02:01Z

1

Here is the example code for your requirement Your html file

<ion-list *ngFor="let item of items">
      <ion-col width-50>
        <ion-checkbox (click)="clickSelectBox(item)"></ion-checkbox>
    </ion-col>
    <ion-col width-50>
          {{item.event_name}}
    </ion-col>
   </ion-list>

Your .ts file

selectedQuestions:string[] = [];

  clickSelectBox(itemKey){
    console.log(itemKey);
     const foundAt = this.selectedQuestions.indexOf(itemKey);
     console.log(foundAt);
     if (foundAt >= 0) {
        this.selectedQuestions.splice(foundAt, 1);
     } else {
        this.selectedQuestions.push(itemKey);
    }
    console.log(this.selectedQuestions);

}

try this and let me know,Hope THIS Will Work

edited Jan 16, 2018 at 10:02

answered Jan 16, 2018 at 6:25

Mahi Parmar

5253 gold badges11 silver badges33 bronze badges

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

Collectives™ on Stack Overflow

Ionic 2- how to get checkbox selected values inside variable/array on button click?

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