diff --git a/src/layout/MainLayout/Header/index.js b/src/layout/MainLayout/Header/index.js
index a854f22..9ddb480 100644
--- a/src/layout/MainLayout/Header/index.js
+++ b/src/layout/MainLayout/Header/index.js
@@ -96,7 +96,6 @@ function Header(props) {
           PNSPS
         </Typography>
         <Divider />
-        <loginContent></loginContent>
         <ul id="sidebartop">
           {loginContent}
         </ul>
@@ -113,7 +112,6 @@ function Header(props) {
           PNSPS
         </Typography>
         <Divider />
-        <loginContent></loginContent>
         <ul id="sidebartop">
           {logoutContent}
         </ul>
diff --git a/src/pages/authentication/Register.js b/src/pages/authentication/Register.js
index 1d04d25..fa8e75f 100644
--- a/src/pages/authentication/Register.js
+++ b/src/pages/authentication/Register.js
@@ -48,6 +48,12 @@ const steps = ['個人資料', '預覽', '完成提交'];
 const Register = () => {
   const [activeStep, setActiveStep] = useState(0);
   const [completed, setCompleted] = useState([false]);
+  // const [isValid, setisValid] = useState(false);
+
+  // const handleIsValidChange = (value) => {
+  //   setisValid(value);
+  //   console.log(value)
+  // };
 
   const totalSteps = () => {
     return steps.length;
@@ -133,6 +139,7 @@ const Register = () => {
       ) : (
         <React.Fragment>
           <AuthWrapper>
+            {/* <CustomFormWizard onIsValidChange={handleIsValidChange} step={activeStep} /> */}
             <CustomFormWizard step={activeStep} />
           </AuthWrapper>
           <Stack direction="row" sx={{ pt: 2 }}>
diff --git a/src/pages/authentication/auth-forms/CustomFormWizard.js b/src/pages/authentication/auth-forms/CustomFormWizard.js
index 69db761..f249c57 100644
--- a/src/pages/authentication/auth-forms/CustomFormWizard.js
+++ b/src/pages/authentication/auth-forms/CustomFormWizard.js
@@ -1,4 +1,4 @@
-import { useEffect, useState } from 'react';
+import { useEffect, useState, useRef } from 'react';
 // import { Link as RouterLink } from 'react-router-dom';
 
 // material-ui
@@ -12,7 +12,6 @@ import {
   InputLabel, OutlinedInput,
   Stack,
   Typography,
-  Select,
   FormGroup,
   TextField,
 //   Paper
@@ -39,11 +38,13 @@ import { EyeInvisibleOutlined, EyeOutlined } from '@ant-design/icons';
 
 // ============================|| FIREBASE - REGISTER ||============================ //
 
-const CustomFormWizard = (props) => {
+const CustomFormWizard = (props, ) => {
     
     const [level, setLevel] = useState();
     const [showPassword, setShowPassword] = useState(false);
     const [showConfirmPassword, setshowConfirmPassword] = useState(false);
+    // const [values, setValues] = useState({});
+
     const handleClickShowPassword = () => {
         setShowPassword(!showPassword);
     };
@@ -61,39 +62,48 @@ const CustomFormWizard = (props) => {
     };
 
     const [selectedIdDocType, setSelectedIdDocType] = useState(null);
-    // const [idDocTypeComboList, setIdDocTypeComboList] = useState([]);
+    const [selectedAddress4, setSelectedAddress4] = useState(null);
+    const [selectedAddress5, setSelectedAddress5] = useState(null);
 
     const idDocTypeComboList = ["passport","HKID","CNID","BR","otherCert"];
-    // function updateUserList (){
-    //     const idList = getIdList(groupUserData);
-    //     if(!idList.includes(selectedUser.id)){
-    //         const userList = [...groupUserData, selectedUser];
-    //         setGroupUserData(userList);
-    //         console.log(userList);
-    //     }
-    // }
-
-    // const checkFormData = (data) =>{
-    //     const dataStatus = false;
-    //     if (data.username)
-    //     return
-    // }
+    const address4ComboList = 
+        ["北區","長洲區","大埔區","大嶼山區","東區","觀塘區","黃大仙區","九龍城區","葵青區","南區","南丫島區",
+         "坪洲區","荃灣區","沙田區","深水埗區","屯門區","灣仔區","西貢區","油尖旺區","元朗區","中西區"];
+    const address5ComboList = ["香港","內地","澳門"];
 
     useEffect(() => {
         changePassword('');
     }, []);
+    
+    const formRef = useRef(null);
+    useEffect(() => {
+        console.log("formRef changed", formRef.current);
+        // onIsValidChange(true);
+      }, [formRef.current]);
 
-    // useEffect(() => {
-    //     tryAPI();
-    // }, []);
+    const checkDataField = (data)=>{
+        if (data.username !=="",
+            data.password !=="",
+            data.enName !=="",
+            data.email !=="",
+            data.password !=="",
+            data.password !==""
+        )
+        {
+            return true
+        }
+    };
 
     const {handleSubmit,register} = useForm({})
     const _onSubmit = (data) => {
+        data.idDocType = selectedIdDocType
+        data.address4 = selectedAddress4
+        data.address5 = selectedAddress5
         console.log(data)
         const userAddress = {
             "addressLine1":data.address1,
             "addressLine2":data.address2,
-            "addressLine3":data.address3,
+            "addressLine3":data.address4,
             "country":data.address5
         }
         const userFaxNo = {
@@ -107,7 +117,7 @@ const CustomFormWizard = (props) => {
         console.log(userAddress)
         console.log(userFaxNo)
         console.log(userMobileNumber)
-        if (data.username !==""){
+        if (checkDataField(data)){
             axios.post(`${apiPath}${POST_PUBLIC_USER_REGISTER}`, {
                 username: data.username,
                 password: data.password,
@@ -136,6 +146,8 @@ const CustomFormWizard = (props) => {
     
     return (
         <Formik
+            enableReinitialize={true}
+            innerRef={(f) => (formRef.current = f)}
             initialValues={{
             username:'',
             enName: '',
@@ -144,13 +156,10 @@ const CustomFormWizard = (props) => {
             address1: '',
             address2: '',
             address3: '',
-            address4: '',
-            address5: '',
             password: '',
             confirmPassword: '',
             phone:'',
             idNo:'',
-            idDocType :'',
             checkDigit:'',
             submit: null
             }}
@@ -169,9 +178,12 @@ const CustomFormWizard = (props) => {
             idType: Yup.string().max(255).required('請輸入第三行地址'),
             })}
         >
-            {({ errors, handleBlur, handleChange, touched, values }) => (
-            // <Paper>
+            {({ errors, handleBlur, handleChange, touched, values, isValid }) =>
+            // console.log(Boolean(touched.password && errors.password))
+            // addFieldError(Boolean(touched.password && errors.password))
+            (
                 <form onSubmit={handleSubmit(_onSubmit)} >
+                {/* Input Form */}
                     <FormGroup id={"inputForm"} sx={{ display: props.step === 0 ? "" : "none" }}>
                         <Grid container spacing={3}>
                             <Grid item xs={12}>
@@ -207,7 +219,7 @@ const CustomFormWizard = (props) => {
                                                 onKeyDown: (e) => {
                                                     if (e.key === 'Enter') {
                                                         e.preventDefault();
-                                                      }
+                                                    }
                                                 },
                                             }}
                                         />
@@ -254,11 +266,12 @@ const CustomFormWizard = (props) => {
                                                     </InputAdornment>
                                                     }
                                                     placeholder="密碼"
+                                                    onBlur={handleBlur}
                                                     inputProps={{
                                                         onKeyDown: (e) => {
                                                             if (e.key === 'Enter') {
                                                                 e.preventDefault();
-                                                              }
+                                                            }
                                                         },
                                                     }}
                                                 />
@@ -300,7 +313,7 @@ const CustomFormWizard = (props) => {
                                                         onKeyDown: (e) => {
                                                             if (e.key === 'Enter') {
                                                                 e.preventDefault();
-                                                                }
+                                                            }
                                                         },
                                                     }}
                                                     endAdornment={
@@ -353,78 +366,111 @@ const CustomFormWizard = (props) => {
 
                                     <Grid container>
                                         <Grid item xs={12} md={6} >
-                                            <Stack spacing={1}  sx={{mr:{md:1},mb:{xs:1}}}>
+                                            <Stack spacing={1}  sx={{mr:{md:1},mb:{xs:0.5}}}>
                                                 <Autocomplete
                                                     disablePortal
                                                     id="idDocType-combo"
                                                     value={selectedIdDocType === null ? null : selectedIdDocType}
                                                     options={idDocTypeComboList}
                                                     onChange={(event, newValue) => {
-                                                        setSelectedIdDocType(newValue);
+                                                        if (newValue !== null){
+                                                            setSelectedIdDocType(newValue);
+                                                        }
                                                     }}
-                                                    
-                                                    sx={{"& .MuiInputBase-root": { height: "41px" }}}
-                                                    renderInput={(params) => <TextField {...params} placeholder="證件類別" sx={{ height: "41px" }}/>}
+                                                    sx={{"& .MuiInputBase-root": { height: "41px" },"#idDocType-combo":{padding: "0px 0px 0px 0px"}, "& .MuiAutocomplete-endAdornment": { top: "auto" },}}
+                                                    renderInput={(params) => <TextField {...params} placeholder="證件類別"/>}
                                                 />
                                             </Stack>
                                         </Grid>
-                                        <Grid item xs={12} md={5}>
-                                            <Stack spacing={1}>
-                                                <OutlinedInput
-                                                    id="idNo-login"
-                                                    type="text"
-                                                    value={values.idNo}
-                                                    name="idNo"
-                                                    {...register("idNo")}
-                                                    onChange={handleChange}
-                                                    placeholder="證件號碼"
-                                                    fullWidth
-                                                    sx={{mr:1}}
-                                                    error={Boolean(touched.idNo && errors.idNo)}
-                                                    inputProps={{
-                                                        onKeyDown: (e) => {
-                                                            if (e.key === 'Enter') {
-                                                                e.preventDefault();
+                                        {selectedIdDocType =="HKID"?
+                                            <>
+                                                <Grid item xs={10} md={5}>
+                                                    <Stack spacing={1}>
+                                                        <OutlinedInput
+                                                            id="idNo-login"
+                                                            type="text"
+                                                            value={values.idNo}
+                                                            name="idNo"
+                                                            {...register("idNo")}
+                                                            onChange={handleChange}
+                                                            placeholder="證件號碼"
+                                                            fullWidth
+                                                            sx={{mr:1}}
+                                                            error={Boolean(touched.idNo && errors.idNo)}
+                                                            inputProps={{
+                                                                onKeyDown: (e) => {
+                                                                    if (e.key === 'Enter') {
+                                                                        e.preventDefault();
+                                                                    }
+                                                                },
+                                                            }}
+                                                        />
+                                                        {touched.idNo && errors.idNo && (
+                                                            <FormHelperText error id="helper-text-enName-signup">
+                                                            {errors.idNo}
+                                                            </FormHelperText>
+                                                        )}
+                                                    </Stack>
+                                                </Grid>
+                                                <Grid item xs={2} md={1}>
+                                                    <Stack spacing={1}>
+                                                        <OutlinedInput
+                                                            id="checkDigit-login"
+                                                            type="text"
+                                                            value={values.checkDigit}
+                                                            name="checkDigit"
+                                                            {...register("checkDigit")}
+                                                            onChange={handleChange}
+                                                            placeholder="( )"
+                                                            // sx={{height:"53px"}}
+                                                            inputProps={{
+                                                                maxLength: 1,
+                                                                onKeyDown: (e) => {
+                                                                    if (e.key === 'Enter') {
+                                                                        e.preventDefault();
+                                                                    }
+                                                                },
+                                                            }}
+                                                            fullWidth
+                                                            error={Boolean(touched.checkDigit && errors.checkDigit)}
+                                                        />
+                                                        {touched.checkDigit && errors.checkDigit && (
+                                                            <FormHelperText error id="helper-text-enName-signup">
+                                                            {errors.checkDigit}
+                                                            </FormHelperText>
+                                                        )}
+                                                    </Stack>
+                                                </Grid>
+                                            </>:
+                                            <Grid item xs={12} md={6}>
+                                                <Stack spacing={1}>
+                                                    <OutlinedInput
+                                                        id="idNo-login"
+                                                        type="text"
+                                                        value={values.idNo}
+                                                        name="idNo"
+                                                        {...register("idNo")}
+                                                        onChange={handleChange}
+                                                        placeholder="證件號碼"
+                                                        fullWidth
+                                                        sx={{mr:1}}
+                                                        error={Boolean(touched.idNo && errors.idNo)}
+                                                        inputProps={{
+                                                            onKeyDown: (e) => {
+                                                                if (e.key === 'Enter') {
+                                                                    e.preventDefault();
                                                                 }
-                                                        },
-                                                    }}
-                                                />
-                                                {touched.idNo && errors.idNo && (
-                                                    <FormHelperText error id="helper-text-enName-signup">
-                                                    {errors.idNo}
-                                                    </FormHelperText>
-                                                )}
-                                            </Stack>
-                                        </Grid>
-                                        <Grid item xs={12} md={1}>
-                                            <Stack spacing={1}>
-                                                <OutlinedInput
-                                                    id="checkDigit-login"
-                                                    type="text"
-                                                    value={values.checkDigit}
-                                                    name="checkDigit"
-                                                    {...register("checkDigit")}
-                                                    onChange={handleChange}
-                                                    placeholder="( )"
-                                                    // sx={{height:"53px"}}
-                                                    inputProps={{
-                                                        maxLength: 1,
-                                                        onKeyDown: (e) => {
-                                                            if (e.key === 'Enter') {
-                                                                e.preventDefault();
-                                                            }
-                                                        },
-                                                    }}
-                                                    fullWidth
-                                                    error={Boolean(touched.checkDigit && errors.checkDigit)}
-                                                />
-                                                {touched.checkDigit && errors.checkDigit && (
-                                                    <FormHelperText error id="helper-text-enName-signup">
-                                                    {errors.checkDigit}
-                                                    </FormHelperText>
-                                                )}
-                                            </Stack>
-                                        </Grid>
+                                                            },
+                                                        }}
+                                                    />
+                                                    {touched.idNo && errors.idNo && (
+                                                        <FormHelperText error id="helper-text-enName-signup">
+                                                        {errors.idNo}
+                                                        </FormHelperText>
+                                                    )}
+                                                </Stack>
+                                            </Grid>
+                                        }
                                     </Grid>
                                 </Grid>
                                 
@@ -447,7 +493,7 @@ const CustomFormWizard = (props) => {
                                                 onKeyDown: (e) => {
                                                     if (e.key === 'Enter') {
                                                         e.preventDefault();
-                                                        }
+                                                    }
                                                 },
                                             }}
                                         />
@@ -475,7 +521,7 @@ const CustomFormWizard = (props) => {
                                                 onKeyDown: (e) => {
                                                     if (e.key === 'Enter') {
                                                         e.preventDefault();
-                                                        }
+                                                    }
                                                 },
                                             }}
                                         />
@@ -504,7 +550,7 @@ const CustomFormWizard = (props) => {
                                                 onKeyDown: (e) => {
                                                     if (e.key === 'Enter') {
                                                         e.preventDefault();
-                                                        }
+                                                    }
                                                 },
                                             }}
                                         />
@@ -521,7 +567,7 @@ const CustomFormWizard = (props) => {
                                                 onKeyDown: (e) => {
                                                     if (e.key === 'Enter') {
                                                         e.preventDefault();
-                                                        }
+                                                    }
                                                 },
                                             }}
                                         />
@@ -538,48 +584,38 @@ const CustomFormWizard = (props) => {
                                                 onKeyDown: (e) => {
                                                     if (e.key === 'Enter') {
                                                         e.preventDefault();
-                                                        }
+                                                    }
                                                 },
                                             }}
                                         />
-                                        <Select
-                                            name ="address4"
-                                            multiple
-                                            displayEmpty
-                                            value={""}
-                                            onChange={handleChange}
-                                            input={<OutlinedInput />}
-                                            {...register("address4")}
-                                            renderValue={(selected) => {
-                                            if (selected.length === 0) {
-                                                return "區域 (只適用於香港)";
-                                            }
-
-                                            return selected.join(', ');
-                                            }}
-                                            // MenuProps={MenuProps}
-                                            inputProps={{ 'aria-label': 'Without label' }}
-                                        >
-                                        </Select>
-                                        <Select
-                                            name = "address5"
-                                            multiple
-                                            displayEmpty
-                                            value={""}
-                                            onChange={handleChange}
-                                            input={<OutlinedInput />}
-                                            {...register("address5")}
-                                            renderValue={(selected) => {
-                                            if (selected.length === 0) {
-                                                return "國家/地區";
-                                            }
-
-                                            return selected.join(', ');
-                                            }}
-                                            // MenuProps={MenuProps}
-                                            inputProps={{ 'aria-label': 'Without label' }}
-                                        >
-                                        </Select>
+                                        <Autocomplete
+                                                    disablePortal
+                                                    id="address4-combo"
+                                                    value={selectedAddress4 === null ? null : selectedAddress4}
+                                                    options={address4ComboList}
+                                                    onChange={(event, newValue) => {
+                                                        if (newValue !== null){
+                                                            setSelectedAddress4(newValue);
+                                                        }
+                                                    }}
+                                                    
+                                                    sx={{"& .MuiInputBase-root": { height: "41px" },"#address4-combo":{padding: "0px 0px 0px 0px"}, "& .MuiAutocomplete-endAdornment": { top: "auto" },}}
+                                                    renderInput={(params) => <TextField {...params} placeholder="區域 (只適用於香港)"/>}
+                                        />
+                                       <Autocomplete
+                                                    disablePortal
+                                                    id="address5-combo"
+                                                    value={selectedAddress5 === null ? null : selectedAddress5}
+                                                    options={address5ComboList}
+                                                    onChange={(event, newValue) => {
+                                                        if (newValue !== null){
+                                                            setSelectedAddress5(newValue);
+                                                        }
+                                                    }}
+                                                    
+                                                    sx={{"& .MuiInputBase-root": { height: "41px" },"#address5-combo":{padding: "0px 0px 0px 0px"}, "& .MuiAutocomplete-endAdornment": { top: "auto" },}}
+                                                    renderInput={(params) => <TextField {...params} placeholder="國家/地區"/>}
+                                        />
                                         {touched.address1 && errors.address1 && (
                                             <FormHelperText error id="helper-text-address1-signup">
                                             {errors.address1}
@@ -623,7 +659,7 @@ const CustomFormWizard = (props) => {
                                                         onKeyDown: (e) => {
                                                             if (e.key === 'Enter') {
                                                                 e.preventDefault();
-                                                              }
+                                                            }
                                                         },
                                                     }}
                                                 />
@@ -653,7 +689,7 @@ const CustomFormWizard = (props) => {
                                                         onKeyDown: (e) => {
                                                             if (e.key === 'Enter') {
                                                                 e.preventDefault();
-                                                              }
+                                                            }
                                                         },
                                                     }}
                                                 />
@@ -788,7 +824,7 @@ const CustomFormWizard = (props) => {
                                             <Typography display="inline" variant="h6" sx={{ fontSize: 12, color: 'primary.primary'}}>如: 香港身份證; 護照; 中國內地身份證等</Typography>          
                                         </Stack>
                                         <Stack mt={1} direction="row" justifyContent="flex-start" alignItems="center" spacing={2}>
-                                            <Button variant="contained" type="submit" sx={{ fontSize: 12,height:'25px'}}>Submit</Button>
+                                            <Button disabled={!isValid} variant="contained" type="submit" sx={{ fontSize: 12,height:'25px'}}>Submit</Button>
                                         </Stack>
                                     </Stack>
                                 </Grid>
@@ -813,6 +849,7 @@ const CustomFormWizard = (props) => {
                             </Grid>
                         </Grid>
                     </FormGroup>
+                {/* Preview Form */}
                     <FormGroup id={"previewForm"} sx={{ display: props.step === 1 ? "" : "none"}}>
                         <Grid container spacing={2}>
                             <Grid item xs={12}>
@@ -974,7 +1011,6 @@ const CustomFormWizard = (props) => {
                     </FormGroup>
                      
                 </form>
-            // </Paper>
             )}
         </Formik>
     );