Kinark / Materialize-stepper

A little plugin that implements a stepper to Materializecss framework.
https://kinark.github.io/Materialize-stepper/
MIT License
227 stars 60 forks source link

Stepper navigation error #28

Closed feclist closed 6 years ago

feclist commented 7 years ago

Implemented stepper add on that introduces parallel stepper behaviour with each previous step being validated. Custom validators are also introduced per step in order for the user to define custom step validation.

This add on gives the user more freedom in navigating through the stepper with form validation taken into account.

The new introduced stepper type is 'parallel', coming from parallel form validation behaviour. A user is now able to navigate freely through the stepper with all previous steps being validated.

I introduced a new option for the action button element, namely a custom validator for a step. A user can now define custom validation when the behaviour is set to parallel. This function will be called in the validation of the previous steps from the current step.

Example usage: <div class="step-actions input-field"> <button class="waves-effect waves-dark btn next-step" data-validator="customValidator">CONTINUE</button> </div>

A use case for this is whenever there's a form that needs to be revisited often and only step 'x' needs to edited. It would be a tedious job for the user to constantly click on next or when linear is not set to have the user validate every form step by hand.

Kinark commented 7 years ago

I didn't quite get. In my undestanding, there will be two new features, a new type of stepper (parallel) and the custom validation option, right? Wouldn't the custom validation be the same as the feedback function? Also, could you provide a CodePen example or something just to clarify some questions of mine?

Beside that, it sounds like a good implementation, the duality between the linear and the non-linear always made people a little undecided. It souns like a good mix of'em. Thx :)

feclist commented 7 years ago

Hey Kinark,

I made a Codepen with some example use cases.

To answer the first question, yes those are two new features. The custom validation is added for the parallel feature to properly work, besides that there is no real use for the custom validation.

The custom validation feature should always have functions that return a boolean value. Both the validation and feedback offer similar functionalities. One main difference is that the feedback function overrides all behaviour and gives complete control to the user on how to progress to the next step. Therefore it is not a given that this function will always return a boolean. I added the custom validation option to make sure that whenever the parallel validateprevioussteps function is called it can always assume that this validation (if present) returns a boolean value in order to check if the validation succeeded or not. If I would use the feedback option for this, I could get weird behaviour because I just want to validate and not progress to the next step when I click through the parellel stepper. I however do want feedback on some steps when the user clicks the continue button, thus meaning that the feedback will also trigger the next step.

I hope this long story clears things up a bit. If this still leaves you with questions let me know!

feclist commented 7 years ago

Committed two changes, I missed a minor bug. Now it all properly works :)

Kinark commented 6 years ago

Got it. Cool feature, bro, I loved it. Could you add it into the documentation? I'm facing various bugs in my life, I can't find time for anything right now :(

When it's documented, I'll merge :) Thank you!

Also, sorry for the late answer ;-;

feclist commented 6 years ago

I wrote docs for the parallel stepper. I'm not sure if it's clear enough :). The demo also won't properly work until the <script src="https://rawgit.com/Kinark/Materialize-stepper/master/materialize-stepper.min.js"></script> source contains the correct new code.

I didn't change anything on the CHANGELOG and authors yet, I'll leave that up to you :)

If anything is missing let me know!

Kinark commented 6 years ago

I think that's pretty much it. I'm merging the PR and adding you to the authors. Oh, and also change the log.

Kinark commented 6 years ago

Thank you :)