diff --git a/client/src/app/pages/assessment/components/questionnaire-form/multi-input-selection/multi-input-selection.tsx b/client/src/app/pages/assessment/components/questionnaire-form/multi-input-selection/multi-input-selection.tsx index d2b08203d3..aea19eeb74 100644 --- a/client/src/app/pages/assessment/components/questionnaire-form/multi-input-selection/multi-input-selection.tsx +++ b/client/src/app/pages/assessment/components/questionnaire-form/multi-input-selection/multi-input-selection.tsx @@ -29,50 +29,53 @@ export const MultiInputSelection: React.FC = ({ const { t } = useTranslation(); return ( - {sortedOptions.map((option, i) => ( - - ( - { - onChange(option.text); - }} - aria-label={option.text} - label={ - <> - {option.autoAnswered && option.autoAnswerFor?.length ? ( - `"${t.tag}"`) - .join(", "), - } - )} - > - - - - - ) : null}{" "} - {option.text} - - } - value={option.text} - /> - )} - /> - - ))} + {sortedOptions.map((option, i) => { + const answerUniqueId = `${questionFieldName}-${option.text}-${i}}`; + return ( + + ( + { + onChange(option.text); + }} + aria-label={option.text} + label={ + <> + {option.autoAnswered && option.autoAnswerFor?.length ? ( + `"${t.tag}"`) + .join(", "), + } + )} + > + + + + + ) : null}{" "} + {option.text} + + } + value={option.text} + /> + )} + /> + + ); + })} ); }; diff --git a/client/src/app/pages/assessment/components/questionnaire-form/questionnaire-form.tsx b/client/src/app/pages/assessment/components/questionnaire-form/questionnaire-form.tsx index 4604f4ddf1..8bc3ddbb01 100644 --- a/client/src/app/pages/assessment/components/questionnaire-form/questionnaire-form.tsx +++ b/client/src/app/pages/assessment/components/questionnaire-form/questionnaire-form.tsx @@ -53,35 +53,40 @@ export const QuestionnaireForm: React.FC = ({ {section.name} - {sortedQuestions.map((question) => ( - - - - - {question.text} - - {question.explanation}}> - - - - - - - - - - - ))} + {sortedQuestions.map((question) => { + const questionUniqueKey = `${section.name}-${ + question.order || "no-order" + }-${question.text || "no-text"}`; + return ( + + + + + {question.text} + + {question.explanation}}> + + + + + + + + + + + ); + })} diff --git a/client/src/app/pages/assessment/form-utils.ts b/client/src/app/pages/assessment/form-utils.ts index 43fcb26f5d..bfaf64705f 100644 --- a/client/src/app/pages/assessment/form-utils.ts +++ b/client/src/app/pages/assessment/form-utils.ts @@ -15,6 +15,6 @@ export const getCommentFieldName = (section: Section, fullName: boolean) => { }; export const getQuestionFieldName = (question: Question, fullName: boolean) => { - const fieldName = `question-${question.order}`; + const fieldName = `question-${question.order}-${question.text}}`; return fullName ? `${QUESTIONS_KEY}.${fieldName}` : fieldName; };