How to know if checkbox has been checked using handler (data field) inside alert controller?

Hello, here’s my code:

const alert = await this.alertController.create({
header: ‘Checkbox’,
inputs: [
{
name: ‘agree’,
type: ‘checkbox’,
label: ‘I have read and agreed with the terms of…’,
value: ‘value1’,
checked: false
}
],
buttons: [
{
text: ‘Cancel’,
role: ‘cancel’,
cssClass: ‘secondary’,
handler: () => {
console.log(‘Confirm Cancel’);
}
}, {
text: ‘Ok’,
handler: (data) => {
console.log(data.agree[‘checked’]);
if(data.agree) {
console.log(“Ok”);
return true;
}
else {
return;
}
}
}
]
});

I want to know if the user has checked the box with “I have read and agreed…” to let him navigate to a new page. I have tried many things to access the “checked” property of the checkbox called “agree”. Usually, in an alert prompt, I’d call a field “email” and access it using data.email but here, it doesn’t seem to work.
Anyone know what I can do?

As you’ve written it here, the checkbox will toggle the property value1 inside that data object in your OK handler:

text: ‘Ok’,
handler: (data) => {
  if (data.value1) {
    // user checked box
  }
}

If the checkbox isn’t checked, there will be no value1 property in data.

Nope, tried it. Doesn’t work.
Not in the if statement and not even when I log it on the console to check the value returned.

Found the solution!

handler: (data) => {
console.log(data);
if(data.length != 0) {
console.log(‘I got here!!!’);
if(this.selectedType == ‘food’) {
this.router.navigate([’/food-page’]);
} else {
//code
}
}

When you console.log(data) (after having checked the check box and clicked on OK); in this case, [“value1”] will be returned. [“value1”] has a few properties in between which, a property called length which is equal to 0 if you check the console.
So, I used data.length to check the length of the array, if it is equal to 0, nothing happens. Else, it will work!