bulma-steps icon indicating copy to clipboard operation
bulma-steps copied to clipboard

Callback on beforeNext

Open francesco-loreti opened this issue 5 years ago • 1 comments

Is it possible block nextStep? I have tried with "return false;" in beforeNext event but not work. Thanks!

francesco-loreti avatar Jul 17 '19 16:07 francesco-loreti

Hi @francesco-loreti,

It's possible to block a step on condition, it's a bit tricky but it works. You'll find below how I figured it out.

let steps = bulmaSteps.attach('.steps', {
    ...

    beforeNext: id => {
        switch(id) {
            // first step
            case 0:
                // must return an array of errors
                // if empty it goes to next step
                // if not empty it triggers onError with the first item of array
                return validateFirstStep();
            
            // second step
            case 1:
                ...
        }
    },
    onError: error => {
        console.log(error);
    }
});

const validateFirstStep = () => {
    let errors = [];
    ...

    if (validationRuleNotVerified) {
        errors.push('Validation rule not verified');
    }
    if (otherValidationRuleNotVerified) {
        errors.push('Other validation rule not verified');
    }
    return errors;
};

masiref avatar Mar 26 '20 09:03 masiref