diff --git a/src/pages/authentication/auth-forms/BusCustomFormWizard.js b/src/pages/authentication/auth-forms/BusCustomFormWizard.js
index 13de4e4..04c1d0e 100644
--- a/src/pages/authentication/auth-forms/BusCustomFormWizard.js
+++ b/src/pages/authentication/auth-forms/BusCustomFormWizard.js
@@ -100,6 +100,7 @@ const BusCustomFormWizard = (props) => {
     const email = document.getElementById("email-login")
     const [checkEmail, setCheckEmail] = useState(false)
     const [checkEmailBlur, setCheckEmailBlur] = useState(false)
+    const [districtErrStr, setDistrictErrStr] = useState("")
 
     const address4ComboList = ComboData.district;
     const address5ComboList = ComboData.country;
@@ -171,6 +172,22 @@ const BusCustomFormWizard = (props) => {
         }
     }, [checkEmailBlur])
 
+    useEffect(()=>{
+        setDistrictErrStr("");
+        if(selectedAddress5?.type === "hongKong"){
+            if(selectedAddress4 ==null || selectedAddress4 == ""|| selectedAddress4 == {})
+                setDistrictErrStr(getRequiredErrStr("district"))
+        }
+    },[selectedAddress4, selectedAddress5])
+
+    function getRequiredErrStr(fieldname){
+        return displayErrorMsg(intl.formatMessage({ id: 'require'},{fieldname:fieldname?intl.formatMessage({ id: fieldname}):""}));
+    }
+
+    function getMaxErrStr(num, fieldname){
+        return displayErrorMsg(intl.formatMessage({ id: 'noMoreThenNWords' },{num:num, fieldname:fieldname?intl.formatMessage({ id: fieldname})+": ":""}));
+    }
+
     const onCaptchaChange = () => {
         HttpUtils.post({
             url: POST_CAPTCHA,
@@ -497,17 +514,17 @@ const BusCustomFormWizard = (props) => {
         }),
 
         validationSchema: yup.object().shape({
-            username: yup.string().min(6, displayErrorMsg(intl.formatMessage({id: 'atLeast6CharAccount'}))).required(displayErrorMsg(intl.formatMessage({id: 'requireUsername'})))
+            username: yup.string().min(6, displayErrorMsg(intl.formatMessage({id: 'atLeast6CharAccount'}))).max(30,getMaxErrStr(30)).required(displayErrorMsg(intl.formatMessage({id: 'requireUsername'})))
                 .matches(/^[aA-zZ0-9\s]+$/, { message: displayErrorMsg(intl.formatMessage({id: 'noSpecialCharAccount'})) })
                 .matches(/^\S*$/, { message: displayErrorMsg(intl.formatMessage({id: 'noSpaceAccount'})) }),
-            password: yup.string().min(8, displayErrorMsg(intl.formatMessage({id: 'atLeast8CharPassword'}))).required(displayErrorMsg(intl.formatMessage({id: 'requirePassword'})))
+            password: yup.string().min(8, displayErrorMsg(intl.formatMessage({id: 'atLeast8CharPassword'}))).max(60,getMaxErrStr(60)).required(displayErrorMsg(intl.formatMessage({id: 'requirePassword'})))
                 .matches(/^\S*$/, { message: displayErrorMsg(intl.formatMessage({id: 'noSpacePassword'})) })
                 .matches(/^(?=.*[a-z])/, { message: displayErrorMsg(intl.formatMessage({id: 'atLeastOneSmallLetter'})) })
                 .matches(/^(?=.*[A-Z])/, { message: displayErrorMsg(intl.formatMessage({id: 'atLeastOneCapLetter'})) })
                 .matches(/^(?=.*[0-9])/, { message: displayErrorMsg(intl.formatMessage({id: 'atLeast1Number'})) })
                 .matches(/^(?=.*[!@#%&])/, { message: displayErrorMsg(intl.formatMessage({id: 'atLeast1SpecialChar'})) }),
             confirmPassword: yup.string().min(8, displayErrorMsg(intl.formatMessage({id: 'atLeast8CharPassword'}))).required(displayErrorMsg(intl.formatMessage({id: 'pleaseConfirmPassword'}))).oneOf([yup.ref('password'), null], displayErrorMsg(intl.formatMessage({id: 'samePassword'}))),
-            enName: yup.string().max(255).required(displayErrorMsg(intl.formatMessage({id: 'userRequireEnglishName'}))),
+            enName: yup.string().max(40,getMaxErrStr(40)).required(displayErrorMsg(intl.formatMessage({id: 'userRequireEnglishName'}))),
             enCompanyName: yup.string().matches(/^[^$^*()]+$/, { message: displayErrorMsg('No special characters $/^/*/(/)') }).when('chCompanyName', {
                 is: (chCompanyName) => !chCompanyName || chCompanyName.length === 0,
                 then: yup.string().required(displayErrorMsg('Please enter either English or Chinese name')),
@@ -517,11 +534,11 @@ const BusCustomFormWizard = (props) => {
                 then: yup.string().required(displayErrorMsg(intl.formatMessage({id: 'validateEngOrChiName'}))),
             }),
             chName: yup.string().max(255).required(displayErrorMsg(intl.formatMessage({id: 'userRequireChineseName'}))),
-            address1: yup.string().max(40).required(displayErrorMsg(intl.formatMessage({id: 'validateAddressLine1'}))),
-            address2: yup.string().max(40).required(displayErrorMsg(intl.formatMessage({id: 'validateAddressLine2'}))),
-            address3: yup.string().max(40).required(displayErrorMsg(intl.formatMessage({id: 'validateAddressLine3'}))),
-            email: yup.string().email(displayErrorMsg(intl.formatMessage({id: 'validEmailFormat'}))).max(255).required(displayErrorMsg(intl.formatMessage({id: 'requireEmail'}))),
-            emailConfirm: yup.string().email(displayErrorMsg(intl.formatMessage({id: 'validEmailFormat'}))).max(255).required(displayErrorMsg(intl.formatMessage({id: 'requireEmail'}))).oneOf([yup.ref('email'), null], displayErrorMsg(intl.formatMessage({id: 'validSameEmail'}))),
+            address1: yup.string().max(40, getMaxErrStr(40)).required(displayErrorMsg(intl.formatMessage({id: 'validateAddressLine1'}))),
+            address2: yup.string().max(40, getMaxErrStr(40)),
+            address3: yup.string().max(40, getMaxErrStr(40)),
+            email: yup.string().email(displayErrorMsg(intl.formatMessage({id: 'validEmailFormat'}))).max(255, getMaxErrStr(128)).required(displayErrorMsg(intl.formatMessage({id: 'requireEmail'}))),
+            emailConfirm: yup.string().email(displayErrorMsg(intl.formatMessage({id: 'validEmailFormat'}))).max(128, getMaxErrStr(128)).required(displayErrorMsg(intl.formatMessage({id: 'requireEmail'}))).oneOf([yup.ref('email'), null], displayErrorMsg(intl.formatMessage({id: 'validSameEmail'}))),
             phoneCountryCode: yup.string().min(2, displayErrorMsg(intl.formatMessage({id: 'requireAtLeast2Number'}))).required(displayErrorMsg(intl.formatMessage({id: 'requireDialingCode'}))),
             faxCountryCode: yup.string().min(2, displayErrorMsg(intl.formatMessage({id: 'requireAtLeast2Number'}))),
             phone: yup.string().min(8, displayErrorMsg(intl.formatMessage({id: 'requireAtLeast8Number'}))).required(displayErrorMsg(intl.formatMessage({id: 'requireContactNumber'}))),
@@ -529,7 +546,7 @@ const BusCustomFormWizard = (props) => {
             brExpiryDate: yup.date().min(new Date().toISOString().split("T")[0], displayErrorMsg(intl.formatMessage({id: 'pleaseFillInBusinessRegCertValidityDate'})))
                 .max("2099-12-31", displayErrorMsg(intl.formatMessage({id: 'pleaseFillInBusinessRegCertValidityDate'}))).
                 required(displayErrorMsg(intl.formatMessage({id: 'pleaseFillInBusinessRegCertValidityDate'}))),
-            brNo: yup.string().max(8).required(displayErrorMsg(intl.formatMessage({id: 'pleaseFillInBusinessRegCertNumber'}))).test('checkBrNoFormat', displayErrorMsg(`${intl.formatMessage({id: 'pleaseFillInValidBusinessRegCertNumber'})} (e.g. 12341234)`), function (value) {
+            brNo: yup.string().max(8, getMaxErrStr(8)).required(displayErrorMsg(intl.formatMessage({id: 'pleaseFillInBusinessRegCertNumber'}))).test('checkBrNoFormat', displayErrorMsg(`${intl.formatMessage({id: 'pleaseFillInValidBusinessRegCertNumber'})} (e.g. 12341234)`), function (value) {
                 // var brNo_pattern = /[0-9]{8}-[0-9]{3}-(0[1-9]|1[012])-[0-9]{2}-[0-9A-Z]{1}/
                 var brNo_pattern = /[0-9]{8}/
                 if (value !== undefined) {
@@ -540,7 +557,7 @@ const BusCustomFormWizard = (props) => {
                     }
                 }
             }),
-            captchaField: yup.string().required(displayErrorMsg(intl.formatMessage({id: 'requireVerify'}))),//.oneOf([captcha], displayErrorMsg('請輸入有效驗證'))
+            captchaField: yup.string().max(5,  getMaxErrStr(5)).required(displayErrorMsg(intl.formatMessage({id: 'requireVerify'}))),//.oneOf([captcha], displayErrorMsg('請輸入有效驗證'))
         }, ['enCompanyName', 'chCompanyName']),
 
     });
@@ -942,6 +959,7 @@ const BusCustomFormWizard = (props) => {
                                             id="address2-signup"
                                             value={formik.values.address2}
                                             name="address2"
+                                            onBlur={formik.handleBlur}
                                             onChange={formik.handleChange}
                                             placeholder={intl.formatMessage({id: 'addressLine2'})}
                                             inputProps={{
@@ -958,6 +976,7 @@ const BusCustomFormWizard = (props) => {
                                             id="address3-signup"
                                             value={formik.values.address3}
                                             name="address3"
+                                            onBlur={formik.handleBlur}
                                             onChange={formik.handleChange}
                                             placeholder={intl.formatMessage({id: 'addressLine3'})}
                                             inputProps={{
@@ -974,6 +993,8 @@ const BusCustomFormWizard = (props) => {
                                             value={selectedAddress4}
                                             options={address4ComboList}
                                             disabled={checkCountry}
+                                            error={Boolean(districtErrStr!="")}
+                                            onBlur={formik.handleBlur}
                                             getOptionLabel={(option) => option.type? intl.formatMessage({ id: option.type }) : ""}
                                             onChange={(event, newValue) => {
                                                 setSelectedAddress4(newValue);
@@ -1023,6 +1044,11 @@ const BusCustomFormWizard = (props) => {
                                                 {formik.errors.address3}
                                             </FormHelperText>
                                         )}
+                                         {districtErrStr!= "" && (
+                                            <FormHelperText error >
+                                                {districtErrStr}
+                                            </FormHelperText>
+                                        )}
                                     </Stack>
                                 </Grid>
                                 <Grid item xs={12} mt={1} mb={1}>
diff --git a/src/pages/authentication/auth-forms/CustomFormWizard.js b/src/pages/authentication/auth-forms/CustomFormWizard.js
index 6e88e2d..22b5922 100644
--- a/src/pages/authentication/auth-forms/CustomFormWizard.js
+++ b/src/pages/authentication/auth-forms/CustomFormWizard.js
@@ -648,7 +648,7 @@ const CustomFormWizard = (props) => {
             // faxCountryCode: yup.string().min(3,'請輸入3位數字'),
             phone: yup.string().min(8, displayErrorMsg(intl.formatMessage({ id: 'requireAtLeast8Number' }))).required(displayErrorMsg(intl.formatMessage({ id: 'requireContactNumber' }))),
             // fax: yup.string().min(8,'請輸入8位數字'),
-            captchaField: yup.string().required(displayErrorMsg(intl.formatMessage({ id: 'requireVerify' }))),//.oneOf([captcha], displayErrorMsg('請輸入有效驗證')),
+            captchaField: yup.string().max(5,  getMaxErrStr(5)).required(displayErrorMsg(intl.formatMessage({ id: 'requireVerify' }))),//.oneOf([captcha], displayErrorMsg('請輸入有效驗證')),
         }),
     });
 
@@ -1199,7 +1199,7 @@ const CustomFormWizard = (props) => {
                                             value={selectedAddress4}
                                             options={ComboData.district}
                                             disabled={checkCountry}
-                                            error={Boolean(districtErrStr)}
+                                            error={Boolean(districtErrStr!="")}
                                             onBlur={formik.handleBlur}
                                             getOptionLabel={(option) => option.type ? intl.formatMessage({ id: option.type }) : ""}
                                             onChange={(event, newValue) => {
diff --git a/src/pages/authentication/auth-forms/IAmSmartFormWizard.js b/src/pages/authentication/auth-forms/IAmSmartFormWizard.js
index dba69f3..51f452c 100644
--- a/src/pages/authentication/auth-forms/IAmSmartFormWizard.js
+++ b/src/pages/authentication/auth-forms/IAmSmartFormWizard.js
@@ -38,7 +38,7 @@ import * as HttpUtils from "../../../utils/HttpUtils";
 import LoopIcon from '@mui/icons-material/Loop';
 import { useTheme } from '@mui/material/styles';
 import { useLocation } from "react-router-dom";
-import {FormattedMessage, useIntl} from "react-intl";
+import { FormattedMessage, useIntl } from "react-intl";
 
 // ============================|| FIREBASE - REGISTER ||============================ //
 
@@ -63,6 +63,7 @@ const CustomFormWizard = (props) => {
     const email = document.getElementById("email-login")
     const [checkEmail, setCheckEmail] = useState(false)
     const [checkEmailBlur, setCheckEmailBlur] = useState(false)
+    const [districtErrStr, setDistrictErrStr] = useState("")
 
     const address4ComboList = ComboData.district;
     const address5ComboList = ComboData.country;
@@ -78,11 +79,28 @@ const CustomFormWizard = (props) => {
 
     useEffect(() => {
         location.state?.responseData ?? {}
-        if(captchaImg=="")
-        onCaptchaChange();
+        if (captchaImg == "")
+            onCaptchaChange();
         responseToData();
     }, []);
 
+    useEffect(() => {
+        setDistrictErrStr("");
+        if (selectedAddress5?.type === "hongKong") {
+            if (selectedAddress4 == null || selectedAddress4 == "" || selectedAddress4 == {})
+                setDistrictErrStr(getRequiredErrStr("district"))
+        }
+    }, [selectedAddress4, selectedAddress5])
+
+    function getRequiredErrStr(fieldname){
+        return displayErrorMsg(intl.formatMessage({ id: 'require'},{fieldname:fieldname?intl.formatMessage({ id: fieldname}):""}));
+    }
+
+    function getMaxErrStr(num, fieldname){
+        return displayErrorMsg(intl.formatMessage({ id: 'noMoreThenNWords' },{num:num, fieldname:fieldname?intl.formatMessage({ id: fieldname})+": ":""}));
+    }
+
+
     const responseToData = () => {
         //let rd = JSON.parse("{\"emailAddress\":\"test@gmail.com\",\"postalAddress\":{\"EngPremisesAddress\":{\"EngDistrict\":{\"DcDistrict\":\"KC\",\"Sub-district\":\"TSING YI\"},\"EngEstate\":{\"EstateName\":\"Cheung Hang Estate\",\"EngPhase\":{\"PhaseName\":\"N/A\"}},\"BuildingName\":\"Hang Lai House\",\"EngBlock\":{\"BlockDescriptor\":\"Block\",\"BlockNo\":\"2\"},\"Region\":\"NT\",\"EngStreet\":{\"StreetName\":\"Liu To Road\",\"BuildingNoFrom\":\"6\"},\"Eng3dAddress\":{\"EngFloor\":{\"FloorNum\":\"33\"},\"EngUnit\":{\"UnitDescriptor\":\"Room\",\"UnitNo\":\"3301\"}}}},\"mobileNumber\":{\"CountryCode\":\"852\",\"SubscriberNumber\":\"99999999\"},\"residentialAddress\":{\"ChiPremisesAddress\":{\"Chi3dAddress\":{\"ChiUnit\":{\"UnitDescriptor\":\"室\",\"UnitNo\":\"1010\"},\"ChiFloor\":{\"FloorNum\":\"10\"}},\"ChiBlock\":{\"BlockDescriptor\":\"座\",\"BlockNo\":\"2\"},\"BuildingName\":\"亨麗樓(第2座)\",\"ChiDistrict\":{\"DcDistrict\":\"KC\",\"Sub-district\":\"青衣\"},\"Region\":\"新界\",\"ChiEstate\":{\"EstateName\":\"長亨邨\"},\"ChiStreet\":{\"StreetName\":\"寮肚路\",\"BuildingNoFrom\":\"6\"}}},\"enName\":{\"UnstructuredName\":\"Testing Co One\"},\"idNo\":{\"Identification\":\"G561107\",\"CheckDigit\":\"4\"},\"chName\":{\"ChineseName\":\"測試商一\"}}");
         let rd = JSON.parse(location.state?.responseData.data);
@@ -91,7 +109,7 @@ const CustomFormWizard = (props) => {
             "chName": rd?.chName?.ChineseName ?? "",
             "idNo": rd?.idNo?.Identification ?? "",
             "checkDigit": rd?.idNo?.CheckDigit ?? "",
-			"email": rd?.emailAddress ?? "",
+            "email": rd?.emailAddress ?? "",
             "phone": rd?.mobileNumber?.SubscriberNumber ?? "",
             "phoneCountryCode": rd?.mobileNumber?.CountryCode ?? "",
         };
@@ -136,7 +154,7 @@ const CustomFormWizard = (props) => {
         let buildingName = pAdd.BuildingName ?? "";
         let estate = pAdd.ChiEstate?.EstateName ?? "";
         let district = pAdd.ChiDistrict["Sub - district"] ?? "";
-        return getAddressStr([district, street, estate, buildingName, street, floor, block, unit ]);
+        return getAddressStr([district, street, estate, buildingName, street, floor, block, unit]);
     }
 
     const getAddressStr = (strs) => {
@@ -180,22 +198,22 @@ const CustomFormWizard = (props) => {
 
     useEffect(() => {
         if (iAmSmartData) {
-            formik.setFieldValue("enName", iAmSmartData.enName??"");
-            formik.setFieldValue("chName", iAmSmartData.chName??"");
-            formik.setFieldValue("idNo", iAmSmartData.idNo??"");
-            formik.setFieldValue("checkDigit", iAmSmartData.checkDigit??"");
-            formik.setFieldValue("email", iAmSmartData.email??"");
-            formik.setFieldValue("phone", iAmSmartData.phone??"");
-            formik.setFieldValue("phoneCountryCode", iAmSmartData.phoneCountryCode??"");
-            formik.setFieldValue("address1", iAmSmartData.address1??"");
-            props.setIdNo(iAmSmartData.idNo??"");
+            formik.setFieldValue("enName", iAmSmartData.enName ?? "");
+            formik.setFieldValue("chName", iAmSmartData.chName ?? "");
+            formik.setFieldValue("idNo", iAmSmartData.idNo ?? "");
+            formik.setFieldValue("checkDigit", iAmSmartData.checkDigit ?? "");
+            formik.setFieldValue("email", iAmSmartData.email ?? "");
+            formik.setFieldValue("phone", iAmSmartData.phone ?? "");
+            formik.setFieldValue("phoneCountryCode", iAmSmartData.phoneCountryCode ?? "");
+            formik.setFieldValue("address1", iAmSmartData.address1 ?? "");
+            props.setIdNo(iAmSmartData.idNo ?? "");
         }
     }, [iAmSmartData])
 
     const onCaptchaChange = () => {
         HttpUtils.post({
             url: POST_CAPTCHA,
-            params: { width: 130, height: 40,  captcha: captchaImg},
+            params: { width: 130, height: 40, captcha: captchaImg },
             onSuccess: (responseData) => {
                 props.setBase64Url(responseData.base64Url)
                 localStorage.setItem("base64Url", responseData.base64Url);
@@ -250,8 +268,8 @@ const CustomFormWizard = (props) => {
 
     useEffect(() => {
         props.step == 2 ? _onSubmit() : null;
-        if(captchaImg=="")
-        onCaptchaChange();
+        if (captchaImg == "")
+            onCaptchaChange();
         checkDataField(values)
     }, [props.step])
 
@@ -350,27 +368,27 @@ const CustomFormWizard = (props) => {
 
     const formik = useFormik({
         initialValues: ({
-            email: iAmSmartData.email??"",
-            emailConfirm: iAmSmartData.email??"",
-            address1: iAmSmartData.address1??"",
+            email: iAmSmartData.email ?? "",
+            emailConfirm: iAmSmartData.email ?? "",
+            address1: iAmSmartData.address1 ?? "",
             address2: '',
             address3: '',
-            phone: iAmSmartData.phone??"",
-            phoneCountryCode: iAmSmartData.phoneCountryCode??"852",
+            phone: iAmSmartData.phone ?? "",
+            phoneCountryCode: iAmSmartData.phoneCountryCode ?? "852",
             submit: null,
             fax: '',
             faxCountryCode: '852',
             captchaField: ''
         }),
         validationSchema: yup.object().shape({
-            address1: yup.string().max(40).required(displayErrorMsg(intl.formatMessage({id: 'validateAddressLine1'}))),
-            address2: yup.string().max(40).required(displayErrorMsg(intl.formatMessage({id: 'validateAddressLine2'}))),
-            address3: yup.string().max(40).required(displayErrorMsg(intl.formatMessage({id: 'validateAddressLine3'}))),
-            email: yup.string().email(displayErrorMsg(intl.formatMessage({id: 'validEmailFormat'}))).max(255).required(displayErrorMsg(intl.formatMessage({id: 'requireEmail'}))),
-            emailConfirm: yup.string().email(displayErrorMsg(intl.formatMessage({id: 'validEmailFormat'}))).max(255).required(displayErrorMsg(intl.formatMessage({id: 'requireEmail'}))).oneOf([yup.ref('email'), null], displayErrorMsg(intl.formatMessage({id: 'validSameEmail'}))),
-            phoneCountryCode: yup.string().min(2, displayErrorMsg(intl.formatMessage({id: 'requireAtLeast2Number'}))).required(displayErrorMsg(intl.formatMessage({id: 'requireDialingCode'}))),
-            phone: yup.string().min(8, displayErrorMsg(intl.formatMessage({id: 'requireAtLeast8Number'}))).required(displayErrorMsg(intl.formatMessage({id: 'requireContactNumber'}))),
-            captchaField: yup.string().required(displayErrorMsg(intl.formatMessage({id: 'requireVerify'}))),//.oneOf([captcha], displayErrorMsg('請輸入有效驗證')),
+            address1: yup.string().max(40, getMaxErrStr(40)).required(displayErrorMsg(intl.formatMessage({ id: 'validateAddressLine1' }))),
+            address2: yup.string().max(40),
+            address3: yup.string().max(40),
+            email: yup.string().email(displayErrorMsg(intl.formatMessage({ id: 'validEmailFormat' }))).max(128,  getMaxErrStr(128)).required(displayErrorMsg(intl.formatMessage({ id: 'requireEmail' }))),
+            emailConfirm: yup.string().email(displayErrorMsg(intl.formatMessage({ id: 'validEmailFormat' }))).max(128,  getMaxErrStr(128)).required(displayErrorMsg(intl.formatMessage({ id: 'requireEmail' }))).oneOf([yup.ref('email'), null], displayErrorMsg(intl.formatMessage({ id: 'validSameEmail' }))),
+            phoneCountryCode: yup.string().min(2, displayErrorMsg(intl.formatMessage({ id: 'requireAtLeast2Number' }))).required(displayErrorMsg(intl.formatMessage({ id: 'requireDialingCode' }))),
+            phone: yup.string().min(8, displayErrorMsg(intl.formatMessage({ id: 'requireAtLeast8Number' }))).required(displayErrorMsg(intl.formatMessage({ id: 'requireContactNumber' }))),
+            captchaField: yup.string().max(5,  getMaxErrStr(5)).required(displayErrorMsg(intl.formatMessage({ id: 'requireVerify' }))),//.oneOf([captcha], displayErrorMsg('請輸入有效驗證')),
         }),
     });
 
@@ -393,12 +411,12 @@ const CustomFormWizard = (props) => {
 
                                 <div style={{ borderBottom: "3px solid #1A4399", width: "100%", margin_right: "15px" }}>
                                     <Typography display="inline" variant="h3" sx={{ color: '#1A4399' }}>
-                                        <FormattedMessage id="becomeNewPersonalUser"/>
+                                        <FormattedMessage id="becomeNewPersonalUser" />
                                     </Typography><img src={iAmSmartICon} alt="iAM Smart" width="50" />
                                 </div>
 
                                 <Typography mt={0.25} variant="h6" sx={{ color: '#f10000' }}>
-                                    <FormattedMessage id="requireString"/>。
+                                    <FormattedMessage id="requireString" />。
                                 </Typography>
                                 <Stack mt={1} direction="row" style={{ alignItems: "center" }}><img src={iAmSmartICon} alt="iAM Smart" width="25" /><Typography mt={0.25} variant="h6" >: 表示該項由「智方便」提供。</Typography></Stack>
 
@@ -409,7 +427,7 @@ const CustomFormWizard = (props) => {
                                 <Grid item xs={12} mt={1} mb={1}>
                                     <Stack direction="column" justifyContent="space-between" alignItems="baseline" sx={{ mb: { xs: -0.5, sm: 0.5 } }}>
                                         <Typography display="inline" variant="h4" sx={{ color: 'primary.primary' }}>
-                                            <FormattedMessage id="yourPersonalInformation"/>
+                                            <FormattedMessage id="yourPersonalInformation" />
                                         </Typography>
                                     </Stack>
                                 </Grid>
@@ -418,7 +436,7 @@ const CustomFormWizard = (props) => {
                                         <Stack spacing={1}>
                                             <InputLabel htmlFor="idDocType-signup">
                                                 <Typography variant="h5">
-                                                    香港身份證: {iAmSmartData.idNo+"("+iAmSmartData.checkDigit+")"}
+                                                    香港身份證: {iAmSmartData.idNo + "(" + iAmSmartData.checkDigit + ")"}
                                                 </Typography>
                                             </InputLabel>
                                         </Stack>
@@ -428,7 +446,7 @@ const CustomFormWizard = (props) => {
                                     <Stack spacing={1}>
                                         <InputLabel htmlFor="enName-signup">
                                             <Typography variant="h5">
-                                                <FormattedMessage id="userEnglishName"/>: {iAmSmartData.enName}
+                                                <FormattedMessage id="userEnglishName" />: {iAmSmartData.enName}
                                             </Typography>
                                         </InputLabel>
 
@@ -438,7 +456,7 @@ const CustomFormWizard = (props) => {
                                     <Stack spacing={1}>
                                         <InputLabel htmlFor="chName-signup">
                                             <Typography variant="h5">
-                                                {intl.formatMessage({id: 'userChineseName'})}: {iAmSmartData.chName}
+                                                {intl.formatMessage({ id: 'userChineseName' })}: {iAmSmartData.chName}
                                             </Typography>
                                         </InputLabel>
                                     </Stack>
@@ -447,9 +465,9 @@ const CustomFormWizard = (props) => {
                                     <Stack spacing={1}>
                                         <InputLabel htmlFor="address1-signup">
                                             <Typography variant="h5">
-                                                <FormattedMessage id="formAddress"/>
+                                                <FormattedMessage id="formAddress" />
                                                 <span style={{ color: '#f10000' }}>*</span>
-                                                {iAmSmartData.address1?<img src={iAmSmartICon} alt="iAM Smart" width="25" />:null}
+                                                {iAmSmartData.address1 ? <img src={iAmSmartICon} alt="iAM Smart" width="25" /> : null}
                                             </Typography>
                                         </InputLabel>
                                         <OutlinedInput
@@ -459,7 +477,7 @@ const CustomFormWizard = (props) => {
                                             value={formik.values.address1}
                                             name="address1"
                                             onChange={formik.handleChange}
-                                            placeholder={intl.formatMessage({id: 'addressLine1'})}
+                                            placeholder={intl.formatMessage({ id: 'addressLine1' })}
                                             onBlur={formik.handleBlur}
                                             inputProps={{
                                                 onKeyDown: (e) => {
@@ -475,8 +493,9 @@ const CustomFormWizard = (props) => {
                                             id="address2-signup"
                                             value={formik.values.address2}
                                             name="address2"
+                                            onBlur={formik.handleBlur}
                                             onChange={formik.handleChange}
-                                            placeholder={intl.formatMessage({id: 'addressLine2'})}
+                                            placeholder={intl.formatMessage({ id: 'addressLine2' })}
                                             inputProps={{
                                                 onKeyDown: (e) => {
                                                     if (e.key === 'Enter') {
@@ -491,8 +510,9 @@ const CustomFormWizard = (props) => {
                                             id="address3-signup"
                                             value={formik.values.address3}
                                             name="address3"
+                                            onBlur={formik.handleBlur}
                                             onChange={formik.handleChange}
-                                            placeholder={intl.formatMessage({id: 'addressLine3'})}
+                                            placeholder={intl.formatMessage({ id: 'addressLine3' })}
                                             inputProps={{
                                                 onKeyDown: (e) => {
                                                     if (e.key === 'Enter') {
@@ -507,12 +527,14 @@ const CustomFormWizard = (props) => {
                                             value={selectedAddress4}
                                             options={address4ComboList}
                                             disabled={checkCountry}
-                                            getOptionLabel={(option) => option.type? intl.formatMessage({ id: option.type }) : ""}
+                                            error={Boolean(districtErrStr!="")}
+                                            onBlur={formik.handleBlur}
+                                            getOptionLabel={(option) => option.type ? intl.formatMessage({ id: option.type }) : ""}
                                             onChange={(event, newValue) => {
                                                 setSelectedAddress4(newValue);
                                             }}
                                             sx={{ "& .MuiInputBase-root": { height: "41px" }, "#address4-combo": { padding: "0px 0px 0px 0px" }, "& .MuiAutocomplete-endAdornment": { top: "auto" }, }}
-                                            renderInput={(params) => <TextField {...params} placeholder={intl.formatMessage({id: 'region'})}
+                                            renderInput={(params) => <TextField {...params} placeholder={intl.formatMessage({ id: 'region' })}
                                             />}
                                         />
                                         <Autocomplete
@@ -520,7 +542,7 @@ const CustomFormWizard = (props) => {
                                             id="address5-combo"
                                             value={selectedAddress5}
                                             options={address5ComboList}
-                                            getOptionLabel={(option) => option.type? intl.formatMessage({ id: option.type }) : ""}
+                                            getOptionLabel={(option) => option.type ? intl.formatMessage({ id: option.type }) : ""}
                                             onChange={(event, newValue) => {
                                                 if (newValue !== null) {
                                                     setSelectedAddress5(newValue);
@@ -537,7 +559,7 @@ const CustomFormWizard = (props) => {
                                             }}
 
                                             sx={{ "& .MuiInputBase-root": { height: "41px" }, "#address5-combo": { padding: "0px 0px 0px 0px" }, "& .MuiAutocomplete-endAdornment": { top: "auto" }, }}
-                                            renderInput={(params) => <TextField {...params} placeholder={intl.formatMessage({id: 'regionOrCountry'})} />}
+                                            renderInput={(params) => <TextField {...params} placeholder={intl.formatMessage({ id: 'regionOrCountry' })} />}
                                         />
                                         {formik.touched.address1 && formik.errors.address1 && (
                                             <FormHelperText error id="helper-text-address1-signup">
@@ -554,12 +576,18 @@ const CustomFormWizard = (props) => {
                                                 {formik.errors.address3}
                                             </FormHelperText>
                                         )}
+
+                                        {districtErrStr != "" && (
+                                            <FormHelperText error >
+                                                {districtErrStr}
+                                            </FormHelperText>
+                                        )}
                                     </Stack>
                                 </Grid>
                                 <Grid item xs={12} mt={1} mb={1}>
                                     <Stack direction="column" justifyContent="space-between" alignItems="baseline" sx={{ mb: { xs: -0.5, sm: 0.5 } }}>
                                         <Typography display="inline" variant="h4" sx={{ color: 'primary.primary' }}>
-                                            <FormattedMessage id="yourContact"/>
+                                            <FormattedMessage id="yourContact" />
                                         </Typography>
                                     </Stack>
                                 </Grid>
@@ -569,9 +597,9 @@ const CustomFormWizard = (props) => {
                                             <Stack spacing={1} sx={{ mr: { md: 1 }, mb: 1 }}>
                                                 <InputLabel htmlFor="email-signup">
                                                     <Typography variant="h5">
-                                                        <FormattedMessage id="userContactEmail"/>
+                                                        <FormattedMessage id="userContactEmail" />
                                                         <span style={{ color: '#f10000' }}>*</span>
-                                                        {iAmSmartData.email?<img src={iAmSmartICon} alt="iAM Smart" width="25" />:null}
+                                                        {iAmSmartData.email ? <img src={iAmSmartICon} alt="iAM Smart" width="25" /> : null}
                                                     </Typography>
                                                 </InputLabel>
                                                 <OutlinedInput
@@ -582,7 +610,7 @@ const CustomFormWizard = (props) => {
                                                     value={formik.values.email.trim()}
                                                     name="email"
                                                     onChange={formik.handleChange}
-                                                    placeholder={intl.formatMessage({id: 'userContactEmail'})}
+                                                    placeholder={intl.formatMessage({ id: 'userContactEmail' })}
                                                     onBlur={formik.handleBlur}
                                                     inputProps={{
                                                         onKeyDown: (e) => {
@@ -599,7 +627,7 @@ const CustomFormWizard = (props) => {
                                                 )}
                                                 {checkEmail && (
                                                     <FormHelperText error id="helper-text-email-signup">
-                                                        <FormattedMessage id="emailUsed"/>
+                                                        <FormattedMessage id="emailUsed" />
                                                     </FormHelperText>
                                                 )}
                                             </Stack>
@@ -608,7 +636,7 @@ const CustomFormWizard = (props) => {
                                             <Stack spacing={1} >
                                                 <InputLabel htmlFor="emailConfirm-signup">
                                                     <Typography variant="h5">
-                                                        <FormattedMessage id="userContactEmail"/>
+                                                        <FormattedMessage id="userContactEmail" />
                                                         <span style={{ color: '#f10000' }}>*</span>
                                                     </Typography>
                                                 </InputLabel>
@@ -621,7 +649,7 @@ const CustomFormWizard = (props) => {
                                                     name="emailConfirm"
                                                     // onBlur={formik.handleBlur}
                                                     onChange={formik.handleChange}
-                                                    placeholder={intl.formatMessage({id: 'confirmEmail'})}
+                                                    placeholder={intl.formatMessage({ id: 'confirmEmail' })}
                                                     onBlur={formik.handleBlur}
                                                     inputProps={{
                                                         onKeyDown: (e) => {
@@ -648,9 +676,9 @@ const CustomFormWizard = (props) => {
                                                     <Stack direction="column" spacing={1} sx={{ mr: { md: 1 }, mb: 1 }}>
                                                         <InputLabel htmlFor="phone-signup">
                                                             <Typography variant="h5">
-                                                                <FormattedMessage id="userContactNumber"/>
+                                                                <FormattedMessage id="userContactNumber" />
                                                                 <span style={{ color: '#f10000' }}>*</span>
-                                                                {iAmSmartData.phone?<img src={iAmSmartICon} alt="iAM Smart" width="25" />:null}
+                                                                {iAmSmartData.phone ? <img src={iAmSmartICon} alt="iAM Smart" width="25" /> : null}
                                                             </Typography>
                                                         </InputLabel>
                                                         <Stack direction="row">
@@ -668,7 +696,7 @@ const CustomFormWizard = (props) => {
                                                                     }
                                                                     formik.setFieldValue("phoneCountryCode", value);
                                                                 }}
-                                                                placeholder={intl.formatMessage({id: 'dialingCode'})}
+                                                                placeholder={intl.formatMessage({ id: 'dialingCode' })}
                                                                 error={Boolean(formik.touched.phone && formik.errors.phone)}
                                                                 onBlur={formik.handleBlur}
                                                                 inputProps={{
@@ -695,7 +723,7 @@ const CustomFormWizard = (props) => {
                                                                     }
                                                                     formik.setFieldValue("phone", value);
                                                                 }}
-                                                                placeholder={intl.formatMessage({id: 'userContactNumber'})}
+                                                                placeholder={intl.formatMessage({ id: 'userContactNumber' })}
                                                                 error={Boolean(formik.touched.phone && formik.errors.phone)}
                                                                 onBlur={formik.handleBlur}
                                                                 inputProps={{
@@ -724,7 +752,7 @@ const CustomFormWizard = (props) => {
                                                     <Stack spacing={1} direction="column">
                                                         <InputLabel htmlFor="fax-signup">
                                                             <Typography variant="h5">
-                                                                <FormattedMessage id="userFaxNumber"/>
+                                                                <FormattedMessage id="userFaxNumber" />
                                                             </Typography>
                                                         </InputLabel>
                                                         <Stack direction="row">
@@ -742,7 +770,7 @@ const CustomFormWizard = (props) => {
                                                                     }
                                                                     formik.setFieldValue("faxCountryCode", value);
                                                                 }}
-                                                                placeholder={intl.formatMessage({id: 'dialingCode'})}
+                                                                placeholder={intl.formatMessage({ id: 'dialingCode' })}
                                                                 onBlur={formik.handleBlur}
                                                                 inputProps={{
                                                                     maxLength: 3,
@@ -768,7 +796,7 @@ const CustomFormWizard = (props) => {
                                                                     }
                                                                     formik.setFieldValue("fax", value);
                                                                 }}
-                                                                placeholder={intl.formatMessage({id: 'userFaxNumber'})}
+                                                                placeholder={intl.formatMessage({ id: 'userFaxNumber' })}
                                                                 inputProps={{
                                                                     maxLength: 8,
                                                                     onKeyDown: (e) => {
@@ -791,7 +819,7 @@ const CustomFormWizard = (props) => {
                                 <Grid container>
                                     <Grid item xs={12} md={12}>
                                         <Typography display="inline" variant="h4" sx={{ color: 'primary.primary' }}>
-                                            <FormattedMessage id="termsAndCondition"/>
+                                            <FormattedMessage id="termsAndCondition" />
                                             <span style={{ color: '#f10000' }}>*</span>
                                         </Typography>
                                     </Grid>
@@ -816,7 +844,7 @@ const CustomFormWizard = (props) => {
                                                                 size="small"
                                                             />
                                                             <Typography variant="h5">
-                                                                <FormattedMessage id="acceptTerms"/>
+                                                                <FormattedMessage id="acceptTerms" />
                                                             </Typography>
                                                         </Grid>
                                                     </Grid>
@@ -832,7 +860,7 @@ const CustomFormWizard = (props) => {
                                                                 size="small"
                                                             />
                                                             <Typography variant="h5">
-                                                                <FormattedMessage id="rejectTerms"/>
+                                                                <FormattedMessage id="rejectTerms" />
                                                             </Typography>
                                                         </Grid>
                                                     </Grid>
@@ -846,7 +874,7 @@ const CustomFormWizard = (props) => {
                                 <Grid container>
                                     <Stack direction="column">
                                         <Typography display="inline" variant="h4" sx={{ color: 'primary.primary' }}>
-                                            <FormattedMessage id="verify"/>
+                                            <FormattedMessage id="verify" />
                                             <span style={{ color: '#f10000' }}>*</span>
                                         </Typography>
                                         <Stack spacing={1} direction="row">
@@ -894,7 +922,7 @@ const CustomFormWizard = (props) => {
                             <Stack direction="column" justifyContent="space-between" alignItems="baseline" sx={{ mb: { xs: -0.5, sm: 0.5 } }}>
                                 <div style={{ borderBottom: "3px solid #1A4399", width: "100%", margin_right: "15px" }}>
                                     <Typography display="inline" variant="h3" sx={{ color: '#1A4399' }}>
-                                        <FormattedMessage id="becomeNewPersonalUser"/>
+                                        <FormattedMessage id="becomeNewPersonalUser" />
                                     </Typography>
                                 </div>
                             </Stack>
@@ -904,7 +932,7 @@ const CustomFormWizard = (props) => {
                                 <Grid item xs={12} mt={1} mb={1}>
                                     <Stack direction="column" justifyContent="space-between" alignItems="baseline" sx={{ mb: { xs: -0.5, sm: 0.5 } }}>
                                         <Typography display="inline" variant="h4" sx={{ color: 'primary.primary' }}>
-                                            <FormattedMessage id="yourPersonalInformation"/>
+                                            <FormattedMessage id="yourPersonalInformation" />
                                         </Typography>
                                         {/* <Typography component={Link} to="/login" variant="body1" sx={{ textDecoration: 'none' }} color="primary">
                                         Already have an account?
@@ -914,10 +942,10 @@ const CustomFormWizard = (props) => {
                                 <Grid item xs={12} md={12} >
                                     <Stack spacing={1}>
                                         <Typography variant="h5" color={theme.palette.grey[600]}>
-                                            <FormattedMessage id="userIdDoc"/>
+                                            <FormattedMessage id="userIdDoc" />
                                         </Typography>
                                         <Typography variant="h5" name="preview-idDocType">
-                                            {formik.values.idNo+"("+formik.values.checkDigit+")"}
+                                            {formik.values.idNo + "(" + formik.values.checkDigit + ")"}
                                         </Typography>
                                     </Stack>
                                 </Grid>
@@ -925,7 +953,7 @@ const CustomFormWizard = (props) => {
                                 <Grid item xs={12} md={6}>
                                     <Stack spacing={1} direction="row">
                                         <Typography variant="h5" color={theme.palette.grey[600]}>
-                                            <FormattedMessage id="userEnglishName"/>:
+                                            <FormattedMessage id="userEnglishName" />:
                                         </Typography>
                                         <Typography variant="h5" id="preview-enName-signup">
                                             {formik.values.enName}
@@ -935,7 +963,7 @@ const CustomFormWizard = (props) => {
                                 <Grid item xs={12} md={6}>
                                     <Stack spacing={1} direction="row">
                                         <Typography variant="h5" color={theme.palette.grey[600]}>
-                                            <FormattedMessage id="userChineseName"/>:
+                                            <FormattedMessage id="userChineseName" />:
                                         </Typography>
                                         <Typography variant="h5" id="preview-chName-signup">
                                             {formik.values.chName}
@@ -945,7 +973,7 @@ const CustomFormWizard = (props) => {
                                 <Grid item xs={12}>
                                     <Stack spacing={1} direction="row">
                                         <Typography variant="h5" color={theme.palette.grey[600]}>
-                                            <FormattedMessage id="formAddress"/>:
+                                            <FormattedMessage id="formAddress" />:
                                         </Typography>
                                         <Stack spacing={1} direction="column">
                                             <Typography variant="h5" id="preview-address1-signup">
@@ -964,19 +992,19 @@ const CustomFormWizard = (props) => {
                                             {selectedAddress5.type === "hongKong" ?
                                                 <Stack direction="row">
                                                     <Typography variant="h5" color={theme.palette.grey[600]} id="preview-address4-signup">
-                                                        <FormattedMessage id="region"/>:
+                                                        <FormattedMessage id="region" />:
                                                     </Typography>
                                                     <Typography variant="h5">
-                                                        {!selectedAddress4? "" : intl.formatMessage({id: selectedAddress4.type})}
+                                                        {!selectedAddress4 ? "" : intl.formatMessage({ id: selectedAddress4.type })}
                                                     </Typography>
                                                 </Stack>
                                                 : null}
                                             <Stack direction="row">
                                                 <Typography variant="h5" color={theme.palette.grey[600]} id="preview-address5-signup">
-                                                    <FormattedMessage id="regionOrCountry"/>:
+                                                    <FormattedMessage id="regionOrCountry" />:
                                                 </Typography>
                                                 <Typography variant="h5">
-                                                    {intl.formatMessage({id: selectedAddress5.type})}
+                                                    {intl.formatMessage({ id: selectedAddress5.type })}
                                                 </Typography>
                                             </Stack>
                                         </Stack>
@@ -985,14 +1013,14 @@ const CustomFormWizard = (props) => {
                                 <Grid item xs={12} mt={1} mb={1}>
                                     <Stack direction="column" justifyContent="space-between" alignItems="baseline" sx={{ mb: { xs: -0.5, sm: 0.5 } }}>
                                         <Typography display="inline" variant="h4" sx={{ color: 'primary.primary' }}>
-                                            <FormattedMessage id="yourContact"/>
+                                            <FormattedMessage id="yourContact" />
                                         </Typography>
                                     </Stack>
                                 </Grid>
                                 <Grid item xs={12} md={12}>
                                     <Stack spacing={1} direction="row">
                                         <Typography variant="h5" color={theme.palette.grey[600]}>
-                                            <FormattedMessage id="userContactEmail"/>:
+                                            <FormattedMessage id="userContactEmail" />:
                                         </Typography>
                                         <Typography variant="h5" id="preview-email-signup">
                                             {formik.values.email}
@@ -1002,7 +1030,7 @@ const CustomFormWizard = (props) => {
                                 <Grid item xs={12} md={6}>
                                     <Stack spacing={1} direction="row">
                                         <Typography variant="h5" color={theme.palette.grey[600]}>
-                                            <FormattedMessage id="userContactNumber"/>:
+                                            <FormattedMessage id="userContactNumber" />:
                                         </Typography>
                                         <Typography variant="h5" id="preview-phone-signup">
                                             +{formik.values.phoneCountryCode} {formik.values.phone}
@@ -1013,7 +1041,7 @@ const CustomFormWizard = (props) => {
                                     <Grid item xs={12} md={6}>
                                         <Stack spacing={1} direction="row">
                                             <Typography variant="h5" color={theme.palette.grey[600]}>
-                                                <FormattedMessage id="userFaxNumber"/>:
+                                                <FormattedMessage id="userFaxNumber" />:
                                             </Typography>
                                             <Typography variant="h5" id="preview-fax-signup">
                                                 +{formik.values.faxCountryCode} {formik.values.fax}
@@ -1036,13 +1064,13 @@ const CustomFormWizard = (props) => {
                                     <Stack mt={1} direction="column" justifyContent="flex-start" alignItems="center" spacing={2}>
                                         <CheckCircleOutlineIcon color="success" sx={{ width: "200px", height: "200px" }} />
                                         <Typography display="inline" variant="h4">
-                                            <FormattedMessage id="registerSubmitted"/>
+                                            <FormattedMessage id="registerSubmitted" />
                                         </Typography>
                                         <Typography display="inline" variant="h4">
-                                            <FormattedMessage id="emailSent"/>
+                                            <FormattedMessage id="emailSent" />
                                         </Typography>
                                         <Button variant="outlined" component={Link} to="/login" ><Typography variant="h5">
-                                            <FormattedMessage id="backToLogin"/>
+                                            <FormattedMessage id="backToLogin" />
                                         </Typography></Button>
                                     </Stack>
                                     :
@@ -1054,7 +1082,7 @@ const CustomFormWizard = (props) => {
                                             <FormattedMessage id="registerFail" />
                                         </Typography>
                                         <Button color="error" variant="outlined" component={Link} to="/login" ><Typography variant="h5">
-                                            <FormattedMessage id="backToLogin"/>
+                                            <FormattedMessage id="backToLogin" />
                                         </Typography></Button>
                                     </Stack>
                                 }