How do I make the answers to the survey persist with react and redux?

[john1625b]

What is the current behavior?

The issue/question: Suppose the user enters male for a question with a radio button, then goes to another page and comes back to the survey, the radio button for male is no longer selected.

My current solution: I am storing the answers in redux and passing the answers in the react component with the data prop like this:

<Survey
   data={ props.questions[props.page].answers}
  ....
  ....
/>

Where the prop I am passing in is the answers object of key value pairs. Am I doing this the proper way?

[dmitry-kurmanov]

@john1625b, hello! Thanks for your interest! I will create branch "redux" in on our quick_start_repo and try to reproduce/solve your problem.

[dmitry-kurmanov]

@john1625b, I've created branch "redux" in on our quick_start_repo. Could you please check it?

• git clone https://github.com/surveyjs/surveyjs_react_quickstart.git
• git checkout redux
• npm install
• npm start

[john1625b]

@dmitrykurmanov Thank you for helping me solve my problem! I've cloned and tested out the redux branch and it does solve my problem. If I understand it correctly, the component "remembers" the answers to the survey with the model object that is passed into it? eg:

<SurveyJS.Survey
   model={model}

[dmitry-kurmanov]

@john1625b, hello! Does "redux" brach help you? I am sorry, I don't understand it.

And about the model: SurveyJS core remembers all answers (in model object) and we can get it for example in onValueChanged method:

const onValueChanged = (props, model) => {
  /* model.data  <=== all surveyjs data */
}

May be I don't understand you correctly, please feel free to clarify the problem.

[john1625b]

Your redux branch helped me a lot, thanks a lot. Also I now understand how survey js stores its data in the model object.

Thanks again

[dmitry-kurmanov]

Good! It's weird, but I do not see this branch now, was it in this repository?

[john1625b]

@dmitrykurmanov https://github.com/surveyjs/surveyjs_react_quickstart/tree/redux This is the branch we were talking about right?

[dmitry-kurmanov]

@john1625b, yes thank you! I've lost it :)

[Fahad29]

@dmitrykurmanov

1. There is Multiple schema which is changing on the behalf of button click and the value of AuthenticationReducer.scriptSchema is updated on button click
2. When i put it in props on every next button click it goes to first page
3. React Hook "useSelector" cannot be called at the top level. I have also attached the image please guide me.