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>
|
</mat-form-field>
|
||||||
</div>
|
</div>
|
||||||
<button mat-raised-button (click)="onSubmit()"
|
<button mat-raised-button (click)="onSubmit()"
|
||||||
[disabled]="isFormInvalid()">
|
[disabled]="isFormInvalid() || isSubmitting()">
|
||||||
Submit Application
|
Submit Application
|
||||||
</button>
|
</button>
|
||||||
</section>
|
</section>
|
||||||
|
|
|
||||||
|
|
@ -57,6 +57,7 @@ export class StaffApplicationComponent implements OnInit, OnDestroy, AfterViewIn
|
||||||
public staffApplicationService = inject(ApplicationsService)
|
public staffApplicationService = inject(ApplicationsService)
|
||||||
private resizeObserver: ResizeObserver | null = null;
|
private resizeObserver: ResizeObserver | null = null;
|
||||||
private boundHandleResize: any;
|
private boundHandleResize: any;
|
||||||
|
protected isSubmitting = signal<boolean>(false);
|
||||||
|
|
||||||
protected form: FormGroup<StaffApplicationForm>;
|
protected form: FormGroup<StaffApplicationForm>;
|
||||||
private emails = signal<EmailEntry[]>([]);
|
private emails = signal<EmailEntry[]>([]);
|
||||||
|
|
@ -219,9 +220,11 @@ export class StaffApplicationComponent implements OnInit, OnDestroy, AfterViewIn
|
||||||
}
|
}
|
||||||
|
|
||||||
public onSubmit() {
|
public onSubmit() {
|
||||||
|
this.isSubmitting.set(true);
|
||||||
if (this.form === undefined) {
|
if (this.form === undefined) {
|
||||||
console.error('Form is undefined');
|
console.error('Form is undefined');
|
||||||
this.matSnackBar.open('An error occurred, please try again later')
|
this.matSnackBar.open('An error occurred, please try again later')
|
||||||
|
this.isSubmitting.set(false);
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
if (this.form.valid) {
|
if (this.form.valid) {
|
||||||
|
|
@ -233,6 +236,7 @@ export class StaffApplicationComponent implements OnInit, OnDestroy, AfterViewIn
|
||||||
control?.markAsTouched();
|
control?.markAsTouched();
|
||||||
});
|
});
|
||||||
this.matSnackBar.open('Please fill out all required fields')
|
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() {
|
private sendForm() {
|
||||||
const staffApplication: StaffApplication = this.mapToStaffApplication(this.form.getRawValue());
|
const staffApplication: StaffApplication = this.mapToStaffApplication(this.form.getRawValue());
|
||||||
|
|
||||||
this.staffApplicationService.submitStaffApplication(staffApplication).subscribe(result => {
|
this.staffApplicationService.submitStaffApplication(staffApplication).subscribe({
|
||||||
if (!result.verified_mail) {
|
next: result => {
|
||||||
throw new Error('Submitted a form with an e-mail that was not verified.');
|
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;
|
public currentPageIndex: number = 0;
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue
Block a user