<Autocomplete id="beneficiaryType" placeholder="individual" disableClearable options={beneficiaryTypeListArray} getOptionLabel={(option: any) => option.label} style={{ fontFamily: "Basis Grotesque Arabic Pro", fontStyle: "normal", fontWeight: 500, fontSize: "0.75rem", lineHeight: "18px", color: "#9799A6", }} renderOption={(props: any, option: { label: any }) => ( <AutocompleteOption {...props}> <ListItemContent sx={{ fontFamily: "Basis Grotesque Arabic Pro", fontStyle: "normal", fontWeight: 500, fontSize: "0.75rem", lineHeight: "18px", color: "#9799A6", }} > hello world </ListItemContent> </AutocompleteOption> )} {...register("beneficiaryTypeGuid", { required: true, })} onChange={(e: any, newVal: any) => { console.log(newVal); setBeneficiaryTypeGUID(newVal.beneficiaryTypeGUID); }} /> Consider you are a react developer. help me to solve this problem. - No values are populating in this Beneficiary type field - api side is working. - I want to populate the beneficiary types label on dropdown of beneficiary type fied. - Make appropriate changes and return the updated version of code.
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter