We use Survey.js component in our application. This is how we use it:
JavaScriptconst survey = new Model(surveyJson);
const Home = () => {
// More codes
useEffect(() => {
survey.set('name', customer.name);
}, [customer]);
const onCurrentPageChanged = () => {
// Code to handle the event
};
const onCompleting = () => {
// Code to handle the event
// Make API request to the backend.
};
<Survey
model={survey}
onCurrentPageChanged={onCurrentPageChanged}
onCompleting={onCompleting}
/>
};
We are passing the data from the Survey component to our backend through API. We have experienced few cases where we have sent duplicate data for 2 different forms at the same time to backend. One set of data from a form that was filled out by the user hours before and the other set of data from a new session / form from the same user. It seems like the old form data has not been cleared out and that we somehow are triggering multiple events with two different sets of data. This is a critical issue for us as we are dealing with different customer data, and end up mixing those and sending customer data to the wrong customer.
We suspect that a reason for this could be that the survey
variable is defined as a global variable. Could that be the reason, or could it be something else? Do you see any issues with the code snippet above? Is there a way to make sure we always have maximum one event and not having multiple events in parallel?