diff --git a/samples/ManagementSite/Alloy.ManagementSite.csproj b/samples/ManagementSite/Alloy.ManagementSite.csproj index 54f6238..a3410e2 100644 --- a/samples/ManagementSite/Alloy.ManagementSite.csproj +++ b/samples/ManagementSite/Alloy.ManagementSite.csproj @@ -19,7 +19,7 @@ - + diff --git a/src/@episerver/forms-react/src/components/FormBody.tsx b/src/@episerver/forms-react/src/components/FormBody.tsx index 96b7423..24611b6 100644 --- a/src/@episerver/forms-react/src/components/FormBody.tsx +++ b/src/@episerver/forms-react/src/components/FormBody.tsx @@ -154,10 +154,13 @@ export const FormBody = (props: FormBodyProps) => { dispatchFunctions.updateSubmissionKey(response.submissionKey); localFormCache.set(submissionStorageKey, response.submissionKey); + if (isFormFinalized.current || isProgressiveSubmit.current) { + message.current = response.messages.map(m => m.message).join("
"); + } + if (isFormFinalized.current) { formCache.remove(FormConstants.FormCurrentStep + form.key); localFormCache.remove(submissionStorageKey); - message.current = response.messages.map(m => m.message).join("
"); //redirect after submit let redirectToPage = submitButton?.properties?.redirectToPage if(!isNullOrEmpty(redirectToPage)){ diff --git a/src/@episerver/forms-react/src/components/elements/FileUploadElementBlock.tsx b/src/@episerver/forms-react/src/components/elements/FileUploadElementBlock.tsx index be0ab75..3010e9a 100644 --- a/src/@episerver/forms-react/src/components/elements/FileUploadElementBlock.tsx +++ b/src/@episerver/forms-react/src/components/elements/FileUploadElementBlock.tsx @@ -1,4 +1,4 @@ -import { FileUpload, FormContainer, FormStorage, isNullOrEmpty } from "@episerver/forms-sdk" +import { FileUpload, FormContainer, FormStorage } from "@episerver/forms-sdk" import React, { useMemo } from "react"; import ElementWrapper from "./shared/ElementWrapper"; import { useElement } from "../../hooks/useElement"; @@ -42,7 +42,7 @@ export const FileUploadElementBlock = (props: FileUploadElementBlockProps) => { />
- (Previous posted file(s): {prevFilenames} ) + {prevFilenames && <>(Previous posted file(s): {prevFilenames} )}
diff --git a/src/@episerver/forms-react/src/components/elements/ParagraphTextElementBlock.tsx b/src/@episerver/forms-react/src/components/elements/ParagraphTextElementBlock.tsx index 9022292..1f62c42 100644 --- a/src/@episerver/forms-react/src/components/elements/ParagraphTextElementBlock.tsx +++ b/src/@episerver/forms-react/src/components/elements/ParagraphTextElementBlock.tsx @@ -1,8 +1,8 @@ -import { FormCache, FormContainer, FormStorage, ParagraphText, Url } from "@episerver/forms-sdk" +import { FormContainer, FormStorage, ParagraphText } from "@episerver/forms-sdk" import React, { useMemo } from "react"; import ElementWrapper from "./shared/ElementWrapper"; import { useElement } from "../../hooks/useElement"; -import { ElementCaption, ValidationMessage } from "./shared"; +import { ElementCaption } from "./shared"; import { useForms } from "../../context/store"; export interface ParagraphTextElementBlockProps { @@ -35,7 +35,7 @@ export const ParagraphTextElementBlock = (props: ParagraphTextElementBlockProps) let replacedText = element.properties.paragraphText ?? "" const indicators = ['::', "#"] - + indicators.forEach(indicator => { const placeHolders = extractTextsWithFormat(replacedText, indicator) if (doReplaceText) { diff --git a/src/@episerver/forms-react/src/hooks/useElement.ts b/src/@episerver/forms-react/src/hooks/useElement.ts index 659ba25..df3b0df 100644 --- a/src/@episerver/forms-react/src/hooks/useElement.ts +++ b/src/@episerver/forms-react/src/hooks/useElement.ts @@ -97,13 +97,20 @@ export const useElement = (element: FormElementBase) => { //update form state let inactives = formContext?.dependencyInactiveElements ?? []; + let needUpdate = false; if(isVisible.current){ - inactives = inactives.filter(ek => !equals(ek, element.key)); + if(inactives.includes(element.key)){ + inactives = inactives.filter(ek => !equals(ek, element.key)); + needUpdate = true; + } } else { - !isInArray(element.key, inactives) && inactives.push(element.key); + if(!isInArray(element.key, inactives)){ + inactives.push(element.key); + needUpdate = true; + } } - dispatchFuncs.updateDependencies(inactives); + needUpdate && dispatchFuncs.updateDependencies(inactives); },[formContext?.formSubmissions]); //focus on element if validate fail before submitting @@ -117,7 +124,7 @@ export const useElement = (element: FormElementBase) => { //disable submit button when form submitting useEffect(()=>{ - if(equals(element.contentType, "SubmitButtonElementBlock")){ + if(equals(element.contentType, "SubmitButtonElementBlock") && elementRef.current){ elementRef.current.disabled = formContext?.isSubmitting ?? false; } },[formContext?.isSubmitting])