I'm passing a required props has a property to enable asterisk symbol in label but it not working
<FormControlLabel
control={
<Switch
onChange={event =>
onChangeRow(
rowIndex,
'name',
event.target.checked === true ? 'Y' : 'N'
)
}
disableRipple
style={{ backgroundColor: 'transparent' }}
checked={row.address.name === 'Y'}
color='primary'
/>
}
labelPlacement='start'
label={'Name?'}
required={row.formDesc.name.is_mandatory === 'Y'}
disabled={issubmited.value ? disabled : row.formDesc.name.is_editable === 'N'}
error={hasError('name')}
helpertext={getError('name')}
/>
After I have dicidied to pass custom compoenent to the lable with condition to enable disable asterisk depends on requirement.
<FormControlLabel
control={
<Switch
onChange={event =>
onChangeRow(
rowIndex,
'name',
event.target.checked === true ? 'Y' : 'N'
)
}
disableRipple
style={{ backgroundColor: 'transparent' }}
checked={row.address.name === 'Y'}
color='primary'
/>
}
labelPlacement='start'
label={<Typography>Name?{row.formDesc.name.is_mandatory === 'Y' && <span style={{color: 'red', fontSize: '18px'}}>*</span>}</Typography>}
required={row.formDesc.name.is_mandatory === 'Y'}
disabled={issubmited.value ? disabled : row.formDesc.name.is_editable === 'N'}
error={hasError('name')}
helpertext={getError('name')}
/>