Issue

This Content is from Stack Overflow. Question asked by Ricardo Capozza

I am using a material ui autocomplete field in a Formik form, the form is part of a step form and my problem is that I cannot retrieve the value of the autocomplete field that has been selected by the user when I go back and forth through the form steps . Next I expose the piece of code that I have implemented and that has such a reported problem. Thank you all for the help you can provide.

 <Autocomplete
            defaultValue= {obrasoc.find((os) => os.nom_os == field.value)}
            options={obrasoc}
            getOptionLabel={(option) => option.nom_os}
            isOptionEqualToValue={(option, value) => option.nom_os === value.nom_os}
            renderInput={(params) => (
                <TextField
                    {...params}
                    label='Obra Social'
                    variant="standard"
                    error={meta.touched && meta.error && true}
                    helperText={_renderHelperText()}
                />
            )}
            onChange={(e, value) => {
                console.log('onchange', value);
                fieldHelpers.setValue(value.nom_os)
            }}
        />

Solution

Finally I found the issue, only i had to replace the line label=’Obra Social’ with this label= {field.value ? field.value : ‘Obra Social’} and now i can surf over differents steps of form and the field in question remember the user input.

This Question was asked in StackOverflow by Ricardo Capozza and Answered by Ricardo Capozza It is licensed under the terms of CC BY-SA 2.5. - CC BY-SA 3.0. - CC BY-SA 4.0.