validation fix
This commit is contained in:
parent
a3e4a61015
commit
d8a25984fc
@ -42,15 +42,20 @@ interface Patient {
|
||||
export default function PersonalSection({handleFormSection1Data,patientDataDiplay,type}:Props){
|
||||
|
||||
const [birthDateValue, setBirthDateValue] = React.useState<any>();
|
||||
const [patient, setPatient] = React.useState<Patient>({
|
||||
const [patient, setPatient] = React.useState<any>({
|
||||
fullName: "",
|
||||
fullNameError:false,
|
||||
homePhone: "",
|
||||
cellPhone: "",
|
||||
cellPhoneError: false,
|
||||
email: "",
|
||||
emailError: false,
|
||||
age: "",
|
||||
ageError: false,
|
||||
dateOfBirth: birthDateValue,
|
||||
socialSecurityNumber: "",
|
||||
mailingAddress:"",
|
||||
mailingAddressFalse:false,
|
||||
city: "",
|
||||
state: "",
|
||||
zipCode: "",
|
||||
@ -89,17 +94,31 @@ export default function PersonalSection({handleFormSection1Data,patientDataDipla
|
||||
value={type=='display'?patientDataDiplay.fullName:patient.fullName}
|
||||
disabled={type=='display'}
|
||||
onChange={(e)=>{
|
||||
setPatient((prevValues) => ({
|
||||
setPatient((prevValues:any) => ({
|
||||
...prevValues,
|
||||
fullName: e.target.value,
|
||||
}));
|
||||
}}
|
||||
onBlur={(e) => {
|
||||
if (e.target.value === "") {
|
||||
setPatient((prevValues:any) => ({
|
||||
...prevValues,
|
||||
fullNameError: true,
|
||||
}));
|
||||
} else {
|
||||
setPatient((prevValues:any) => ({
|
||||
...prevValues,
|
||||
fullNameError: false,
|
||||
}));
|
||||
}
|
||||
}}
|
||||
required
|
||||
error={patient.fullName === ""}
|
||||
helperText={patient.fullName === "" ? "Please enter your name" : ""}
|
||||
error={patient.fullNameError}
|
||||
helperText={patient.fullNameError ? "Please enter your name" : ""}
|
||||
/>
|
||||
</Grid>
|
||||
|
||||
|
||||
<Grid item xs={4} className='collapsable-form-style'>
|
||||
<TextField
|
||||
required
|
||||
@ -111,13 +130,26 @@ export default function PersonalSection({handleFormSection1Data,patientDataDipla
|
||||
value={type=='display'?patientDataDiplay.cellPhone:patient.cellPhone}
|
||||
disabled={type=='display'}
|
||||
onChange={(e)=>{
|
||||
setPatient((prevValues) => ({
|
||||
setPatient((prevValues:any) => ({
|
||||
...prevValues,
|
||||
cellPhone: e.target.value,
|
||||
}));
|
||||
}}
|
||||
error={!(/^\d{10}$/.test(patient.cellPhone))}
|
||||
helperText={!(/^\d{10}$/.test(patient.cellPhone)) ? "Please enter a valid 10-digit phone number" : ""}
|
||||
onBlur={(e) => {
|
||||
if (!(/^\d{10}$/.test(e.target.value))) {
|
||||
setPatient((prevValues:any) => ({
|
||||
...prevValues,
|
||||
cellPhoneError: true,
|
||||
}));
|
||||
} else {
|
||||
setPatient((prevValues:any) => ({
|
||||
...prevValues,
|
||||
cellPhoneError: false,
|
||||
}));
|
||||
}
|
||||
}}
|
||||
error={patient.cellPhoneError}
|
||||
helperText={patient.cellPhoneError? "Please enter a valid 10-digit phone number" : ""}
|
||||
/>
|
||||
</Grid>
|
||||
|
||||
@ -131,7 +163,7 @@ export default function PersonalSection({handleFormSection1Data,patientDataDipla
|
||||
value={type=='display'?patientDataDiplay.homePhone:patient.homePhone}
|
||||
disabled={type=='display'}
|
||||
onChange={(e)=>{
|
||||
setPatient((prevValues) => ({
|
||||
setPatient((prevValues:any) => ({
|
||||
...prevValues,
|
||||
homePhone: e.target.value,
|
||||
}));
|
||||
@ -151,13 +183,26 @@ export default function PersonalSection({handleFormSection1Data,patientDataDipla
|
||||
value={type=='display'?patientDataDiplay.email:patient.email}
|
||||
disabled={type=='display'}
|
||||
onChange={(e)=>{
|
||||
setPatient((prevValues) => ({
|
||||
setPatient((prevValues:any) => ({
|
||||
...prevValues,
|
||||
email: e.target.value,
|
||||
}));
|
||||
}}
|
||||
error={!(/^\S+@\S+\.\S+$/.test(patient.email))}
|
||||
helperText={!(/^\S+@\S+\.\S+$/.test(patient.email)) ? "Please enter a valid email address" : ""}
|
||||
onBlur={(e) => {
|
||||
if (!(/^\S+@\S+\.\S+$/.test(e.target.value))) {
|
||||
setPatient((prevValues:any) => ({
|
||||
...prevValues,
|
||||
emailError: true,
|
||||
}));
|
||||
} else {
|
||||
setPatient((prevValues:any) => ({
|
||||
...prevValues,
|
||||
emailError: false,
|
||||
}));
|
||||
}
|
||||
}}
|
||||
error={patient.emailError}
|
||||
helperText={patient.emailError? "Please enter a valid email address" : ""}
|
||||
/>
|
||||
</Grid>
|
||||
<Grid item xs={4} className='collapsable-form-style'>
|
||||
@ -171,13 +216,26 @@ export default function PersonalSection({handleFormSection1Data,patientDataDipla
|
||||
value={type=='display'?patientDataDiplay.age:patient.age}
|
||||
disabled={type=='display'}
|
||||
onChange={(e)=>{
|
||||
setPatient((prevValues) => ({
|
||||
setPatient((prevValues:any) => ({
|
||||
...prevValues,
|
||||
age: e.target.value,
|
||||
}));
|
||||
}}
|
||||
error={patient.age === ""}
|
||||
helperText={patient.age === "" ? "Please enter your age" : ""}
|
||||
onBlur={(e) => {
|
||||
if (e.target.value === "") {
|
||||
setPatient((prevValues:any) => ({
|
||||
...prevValues,
|
||||
ageError: true,
|
||||
}));
|
||||
} else {
|
||||
setPatient((prevValues:any) => ({
|
||||
...prevValues,
|
||||
ageError: false,
|
||||
}));
|
||||
}
|
||||
}}
|
||||
error={patient.ageError}
|
||||
helperText={patient.ageError ? "Please enter your age" : ""}
|
||||
|
||||
/>
|
||||
</Grid>
|
||||
@ -192,7 +250,7 @@ export default function PersonalSection({handleFormSection1Data,patientDataDipla
|
||||
onChange={(newValue) => {
|
||||
setBirthDateValue(newValue);
|
||||
}}
|
||||
renderInput={(params) => <TextField required variant="outlined" {...params} />}
|
||||
renderInput={(params) => <TextField variant="outlined" {...params} />}
|
||||
/>
|
||||
</LocalizationProvider>
|
||||
</FormControl>
|
||||
@ -207,7 +265,7 @@ export default function PersonalSection({handleFormSection1Data,patientDataDipla
|
||||
value={type=='display'?patientDataDiplay.socialSecurityNumber:patient.socialSecurityNumber}
|
||||
disabled={type=='display'}
|
||||
onChange={(e)=>{
|
||||
setPatient((prevValues) => ({
|
||||
setPatient((prevValues:any) => ({
|
||||
...prevValues,
|
||||
socialSecurityNumber: e.target.value,
|
||||
}));
|
||||
@ -227,13 +285,26 @@ export default function PersonalSection({handleFormSection1Data,patientDataDipla
|
||||
value={type=='display'?patientDataDiplay.mailingAddress:patient.mailingAddress}
|
||||
disabled={type=='display'}
|
||||
onChange={(e)=>{
|
||||
setPatient((prevValues) => ({
|
||||
setPatient((prevValues:any) => ({
|
||||
...prevValues,
|
||||
mailingAddress: e.target.value,
|
||||
}));
|
||||
}}
|
||||
error={patient.mailingAddress === ""}
|
||||
helperText={patient.mailingAddress === "" ? "Please enter your mailing address" : ""}
|
||||
onBlur={(e) => {
|
||||
if (e.target.value === "") {
|
||||
setPatient((prevValues:any) => ({
|
||||
...prevValues,
|
||||
mailingAddressError: true,
|
||||
}));
|
||||
} else {
|
||||
setPatient((prevValues:any) => ({
|
||||
...prevValues,
|
||||
mailingAddressError: false,
|
||||
}));
|
||||
}
|
||||
}}
|
||||
error={patient.mailingAddressError}
|
||||
helperText={patient.mailingAddressError? "Please enter your mailing address" : ""}
|
||||
/>
|
||||
</Grid>
|
||||
|
||||
@ -245,7 +316,7 @@ export default function PersonalSection({handleFormSection1Data,patientDataDipla
|
||||
value={type=='display'?patientDataDiplay.state:patient.state}
|
||||
disabled={type=='display'}
|
||||
onChange={(e)=>{
|
||||
setPatient((prevValues) => ({
|
||||
setPatient((prevValues:any) => ({
|
||||
...prevValues,
|
||||
state: e.target.value,
|
||||
}));
|
||||
@ -261,7 +332,7 @@ export default function PersonalSection({handleFormSection1Data,patientDataDipla
|
||||
value={type=='display'?patientDataDiplay.city:patient.city}
|
||||
disabled={type=='display'}
|
||||
onChange={(e)=>{
|
||||
setPatient((prevValues) => ({
|
||||
setPatient((prevValues:any) => ({
|
||||
...prevValues,
|
||||
city: e.target.value,
|
||||
}));
|
||||
@ -277,7 +348,7 @@ export default function PersonalSection({handleFormSection1Data,patientDataDipla
|
||||
value={type=='display'?patientDataDiplay.zipCode:patient.zipCode}
|
||||
disabled={type=='display'}
|
||||
onChange={(e)=>{
|
||||
setPatient((prevValues) => ({
|
||||
setPatient((prevValues:any) => ({
|
||||
...prevValues,
|
||||
zipCode: e.target.value,
|
||||
}));
|
||||
@ -296,7 +367,7 @@ export default function PersonalSection({handleFormSection1Data,patientDataDipla
|
||||
defaultValue={type=='display'?patientDataDiplay.gender:patient.gender}
|
||||
name="radio-buttons-group"
|
||||
onChange={(e)=>{
|
||||
setPatient((prevValues) => ({
|
||||
setPatient((prevValues:any) => ({
|
||||
...prevValues,
|
||||
gender: e.target.value,
|
||||
}));
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user