question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Stepper component doesn't submit form

See original GitHub issue

Issue type

I’m submitting a … (check one with “x”)

  • bug report
  • feature request

Issue description

Current behavior: I am reproducing the example of stepper with validation showed in the nebular documentation, but, when the “next” button is clicked, the console show the follow warning:

Form submission canceled because the form is not connected

I added the type=“button” attribute and I already don’t get the warning, but the function of submit is not called. The only solution that I found, it is add the “click” event in the button to call to the submit function.

Expected behavior: The form should call to the submit function declared in the “ngSubmit” event of the “form” element when the “next” button is clicked.

Steps to reproduce: Add the stepper component with the following code (Validation example): https://akveo.github.io/nebular/docs/components/stepper/examples#nbsteppercomponent

Other information:

npm, node, OS, Browser

$ node --version
v8.11.3

$ npm --version
6.4.1

Angular, Nebular

 "@angular/cli": "6.0.0",
 "@angular/compiler-cli": "6.0.0",
 "@nebular/bootstrap": "2.0.1",
 "@nebular/theme": "2.0.1",

Issue Analytics

  • State:open
  • Created 5 years ago
  • Reactions:1
  • Comments:8 (1 by maintainers)

github_iconTop GitHub Comments

3reactions
IgnacioYanjaricommented, Jan 29, 2019

@Tibing Just go to page, open the dev tools and use the stepper with validations. Press the prev and next buttons and you will notice that the same message appears in the console.

1reaction
pedrotcmcommented, Apr 12, 2019

The problem still occurs on the official website itself.

Read more comments on GitHub >

github_iconTop Results From Across the Web

How to submit the form in stepper - Stack Overflow
I am trying to submit my form on material ui's stepper form. For more information about it: https://material-ui.com/components/steppers/.
Read more >
MDB Pro - Linear Stepper will not submit form
It seems that it's an stepper issue. I'll create a task, our team will check this and fix this as soon as possible....
Read more >
Stepper | Angular Material
When using a single form for the stepper, any intermediate next/previous buttons within the steps must be set to type="button" in order to...
Read more >
Misadventures in web components - falldowngoboone
The experimental component requires a donor number input , either as a child of my-stepper or, my preference, via a data-is attribute on...
Read more >
Form validation in stepper using react hook form - YouTube
In this video I will show how to do validation on a step-basis using react-hook- form in a stepper component. I will also...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found