Search code examples
angularformio

How can you trap onSubmit in Angular *module* when using formio


I really have spent hours on this, to no avail. Time to call in the cavalry.

The are many examples how to trap onSubmit for a formio form when it is configured as a component in Angular. But I can't find any example of trapping the onSubmit for a formio form configured as a module.

Why is it important? After submission of new or edited record on a formio form, the URL defaults to a view of that record .../<form>/<recid>/view. I want to redirect to a different URL. That's easy when the form is defined an as Angular component:

export class AssessmentFormComponent implements OnInit {

  constructor() { }

  ngOnInit() {
  }

  onSubmit(submission: any) {
    window.location.href = 'about:blank';
    alert('Thank you for completing the assessment');
  }
}

I tried similar code in a module, the code within the onSubmit is never triggered. Obviously there is a way to do this; I just can't find it. Please advise.


Solution

  • You can add HTML for formio like this

    <formio #Form [form]="form" [submission]="formSubmission"
        (change) = "onChange($event)" [options]="formIoOptions"
        (submit) = "onSubmit($event)" (render)="onFormLoad(Form)">
    </formio>

    in .ts write your onSubmit method.