Stack Overflow Asked by Òscar Fuentes on December 30, 2021
I am trying to create a pop-up alert using the ionic ion-alert framework and associate it with a button. The problem is that when I press the button, nothing happens and I don’t get any errors.
Full code .ts:
import { Component, OnInit } from '@angular/core';
import { PostProvider } from '../../providers/post-provider';
import { AlertController } from '@ionic/angular';
@Component({
selector: 'app-tab2',
templateUrl: './tab2.page.html',
styleUrls: ['./tab2.page.scss'],
})
export class Tab2Page implements OnInit {
customers: any = [];
constructor(
private postPvdr: PostProvider,
public alertController: AlertController,
) { }
ngOnInit() {
}
async presentAlertMultipleButtons() {
const alert = await this.alertController.create({
cssClass: '.my-custom-class',
header: 'Alert',
subHeader: 'Subtitle',
message: 'This is an alert message.',
buttons: ['Cancel', 'Open Modal', 'Delete']
});
await alert.present();
}
loadCustomer(){
return new Promise(resolve => {
let body = {
aksi : 'getCompanyInfo',
};
this.postPvdr.postData(body, 'proses-api.php').subscribe(data => {
for(let company of data.result){
this.customers.push(company);
}
resolve(true);
});
});
}
}
ion-alert is presentAlertMultipleButtons()
Html code:
<ion-content [fullscreen]="true">
<ion-header>
<ion-toolbar class="toolbar1">
<ion-buttons slot="start">
<ion-menu-button class="icon_menu" autoHide="false"></ion-menu-button>
</ion-buttons>
</ion-toolbar>
</ion-header>
<ion-button expand="full" color ="primary" (click) = "presentAlertMultipleButtons()">
Pop Up </ion-button>
</ion-content>
I have compiled in apk and when I press the button it does nothing, but if I press it many times in a row it gets blocked and a part of the pop-up appears:
Image APK
When I get complicated I get this message in the console:Console Message
EDIT: By browsing elemeno, I have found that it works fine, but I think the alert is below the white background. Does anyone know how to correct it?
Inspect Element
Get help from others!
Recent Questions
Recent Answers
© 2024 TransWikia.com. All rights reserved. Sites we Love: PCI Database, UKBizDB, Menu Kuliner, Sharing RPP