0

Using StepZilla, I'm not able to jump on other step...I'm not using any browser session, here I'm using redux store.

import React from 'react';
import StepZilla from 'react-stepzilla';
import ThankyouStep from './ThankyouStep.js';
import Purchase from './PurchaseStep.js';
import Configure from './ConfigureStep.js';
import {connect} from 'react-redux'
import {selectMainWizardStep} from '../../Actions/WizardActions'
require('../../styles/css/Wizard.css');

class MainWizard extends React.Component {

render() {
    const steps =
        [
            { name: 'Purchase', component: <Purchase /> },
            { name: 'Configure', component: <Configure organizationId = "121334-11-0000000000000" /> },
            { name: 'Thank You', component: <ThankyouStep /> },
        ];

Here after successful Purchase tab filling, I want that to jump on Configure tab. But that jumping is not happening. Here I've commented two lines because that is using browser session. Using browser session I was able to jump to configure step. But the redux state is getting lost because of page refresh. Thats why I used redux store, but I'm not able to jump on configure page.

   return (
        <article className='step-progress'>
            <StepZilla
                steps={steps}
                preventEnterSubmission={true}
                nextTextOnFinalActionStep={'Save'}
                hocValidationAppliedTo={[3]}
                //startAtStep={window.sessionStorage.getItem('step') ? parseFloat(window.sessionStorage.getItem('step')) : 0}
                startAtStep = {this.props.Wizard.selectedWizradStep}
                //onStepChange={(step) => window.sessionStorage.setItem('step', step)}
                onStepChange = {(step) =>this.props.selectMainWizardStep(step)}
                showNavigation={false}
            />
        </article>
    );
}
}

function mapStateToProps(state) {
   return {
       Wizard: state.Wizard
        };
  }

const mapDispatchToProps = {
   selectMainWizardStep
 };

 export default connect(mapStateToProps, mapDispatchToProps)(MainWizard);
Linda Paiste
  • 38,446
  • 6
  • 64
  • 102
Ayushi J
  • 3
  • 3
  • What is your question? Please be specific. If you want help figuring out a bug, explain what the expected output is, and what your current output was. If you get any errors/exceptions, include those in the question. [mcve] – Håken Lid May 15 '18 at 10:19
  • @HåkenLid I updated my post..Hope so this will be helpfull for you to understand my problem. – Ayushi J May 15 '18 at 10:34
  • Why is there a page refresh? – Håken Lid May 15 '18 at 10:41
  • Cannot read property 'onStepChange' of undefined....this error is coming @HåkenLid – Ayushi J May 15 '18 at 11:05

0 Answers0