Prevent duplicate staff application submissions by disabling the submit button during processing.
This commit is contained in:
parent
6f6801c728
commit
300d33da7d
|
|
@ -287,7 +287,7 @@
|
|||
</mat-form-field>
|
||||
</div>
|
||||
<button mat-raised-button (click)="onSubmit()"
|
||||
[disabled]="isFormInvalid()">
|
||||
[disabled]="isFormInvalid() || isSubmitting()">
|
||||
Submit Application
|
||||
</button>
|
||||
</section>
|
||||
|
|
|
|||
|
|
@ -57,6 +57,7 @@ export class StaffApplicationComponent implements OnInit, OnDestroy, AfterViewIn
|
|||
public staffApplicationService = inject(ApplicationsService)
|
||||
private resizeObserver: ResizeObserver | null = null;
|
||||
private boundHandleResize: any;
|
||||
protected isSubmitting = signal<boolean>(false);
|
||||
|
||||
protected form: FormGroup<StaffApplicationForm>;
|
||||
private emails = signal<EmailEntry[]>([]);
|
||||
|
|
@ -219,9 +220,11 @@ export class StaffApplicationComponent implements OnInit, OnDestroy, AfterViewIn
|
|||
}
|
||||
|
||||
public onSubmit() {
|
||||
this.isSubmitting.set(true);
|
||||
if (this.form === undefined) {
|
||||
console.error('Form is undefined');
|
||||
this.matSnackBar.open('An error occurred, please try again later')
|
||||
this.isSubmitting.set(false);
|
||||
return
|
||||
}
|
||||
if (this.form.valid) {
|
||||
|
|
@ -233,6 +236,7 @@ export class StaffApplicationComponent implements OnInit, OnDestroy, AfterViewIn
|
|||
control?.markAsTouched();
|
||||
});
|
||||
this.matSnackBar.open('Please fill out all required fields')
|
||||
this.isSubmitting.set(false);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -246,14 +250,27 @@ export class StaffApplicationComponent implements OnInit, OnDestroy, AfterViewIn
|
|||
private sendForm() {
|
||||
const staffApplication: StaffApplication = this.mapToStaffApplication(this.form.getRawValue());
|
||||
|
||||
this.staffApplicationService.submitStaffApplication(staffApplication).subscribe(result => {
|
||||
if (!result.verified_mail) {
|
||||
throw new Error('Submitted a form with an e-mail that was not verified.');
|
||||
this.staffApplicationService.submitStaffApplication(staffApplication).subscribe({
|
||||
next: result => {
|
||||
if (!result.verified_mail) {
|
||||
this.isSubmitting.set(false);
|
||||
this.matSnackBar.open('Your email has not been verified. Please verify your email before submitting.', 'Close', {
|
||||
duration: 5000
|
||||
});
|
||||
return;
|
||||
}
|
||||
this.router.navigate(['/forms/sent'], {
|
||||
state: {message: result.message}
|
||||
}).then();
|
||||
},
|
||||
error: (error) => {
|
||||
this.isSubmitting.set(false);
|
||||
console.error('Error submitting application:', error);
|
||||
this.matSnackBar.open('An error occurred while submitting your application. Please try again later.', 'Close', {
|
||||
duration: 5000
|
||||
});
|
||||
}
|
||||
this.router.navigate(['/forms/sent'], {
|
||||
state: {message: result.message}
|
||||
}).then();
|
||||
})
|
||||
});
|
||||
}
|
||||
|
||||
public currentPageIndex: number = 0;
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user