Actin sheet loads twice on one button click

Ionic Framework ionic-v3
1

I am using Action sheet in my project,but on clicking the submit button,it loads two times,
Please help me with this:
Each time I click my del button,action sheet loads twice.

del()
{
 let actionsheet = this.actionSheetCtrl.create
({ title:"Delete account", buttons:[{ text: 'Transfer', handler: () => 

{   if(this.delete.value.name=='')  
 {     alert("Please enter the account name"); 
  }   else   {   this.navCtrl.push(TransferPage);
   } //console.log("Camera Clicked");
 }
 },{ text: 'Delete', handler: ()=>{
   if(this.delete.value.name=='')  
 {     alert("Please enter the account name");  
 }   else   {   let key = this.delete.value.name;
    this.store.delete(key);  
alert("Account deleted"); 
 this.navCtrl.push(ContactPage); 
//console.log("Gallery Clicked");
}
 } 
}
] 
}); actionsheet.present();
}
2

can you share HTML code?

3

Ya sure,Below you can finf my html code:

<ion-header>
  <ion-navbar>  
  <ion-title>Delete Account</ion-title>  
</ion-navbar>
</ion-header>
  <ion-content class="background">   
 <form [formGroup]="delete" (ngSubmit)="del()"> 
 <ion-card> 
   <ion-card-header>  
    Delete Your Account(s)
    </ion-card-header>  
  <ion-card-content>    
   <ion-item>       
 <ion-label>Name<span>&nbsp;<sup>*</sup></span>
</ion-label>     
   <ion-input type="text" formControlName="name">
</ion-input> 
     </ion-item>
 <br>     
 <button ion-button block (click)="del()"color="blue">Del</button> 
   </ion-card-content>  
</ion-card>
  </form>
</ion-content>
4

Because you call twice.

<form [formGroup]="delete" (ngSubmit)="del()"> 
<button ion-button block (click)="del()"color="blue">Del</button>

Delete button (click) event. Add type=“submit” attribute to button. If you use (ngSubmit), form will automatically trigger button type=“submit” click event.

3 Likes
5

Thanks It works well now.

6

really help me. thank you