I am facing some issues regarding the form submission

Question

I want to submit the form on the button click as well as navigate to the next page, but it shows an error : "Form submission canceled because the form is not connected".

Can anyone help me with this problem ?? I am using nebular.

This is the html code

            <nb-step [label]="labelOne" [stepControl]="formOne">
        <ng-template #labelOne>Device type</ng-template>
        <form class="form-inline" #formOne="ngForm" >

            // Code goes here...

            <div class="buttonHolder">
                <button nbButton routerLink="/dashboard" nbStepperNext>Cancel</button>
                <button nbButton outline status="primary" (ngSubmit)="onSubmit(formOne)" 
                  nbStepperNext [disabled]="!formOne.valid">Next</button>
            </div>
        </form>
    </nb-step>`

This is the .ts code

    onSubmit(form: NgForm) { console.log(form.value); form.reset(); }

Answer 1

To change page after submitting the form try to import Router and register it in constructor(private _router: Router) in your .ts file.

At the end of onSubmit() method add this._router.navigateByUrl('/pathOfYourNextPage'); and in this way you'll make redirect throught your .ts file.

Hope that will help!