Display correct default value within Form

[Leon910]

We are implementing the backend for our emotion tracker app. Especially we are working on the update operation. When editing an emotion on our details page the edit form opens but the respected emotion type is not pre-selected within the options bar. We are receiving the right data from our database but we are not sure how we need to apply it to the value.

Here’s what I’ve tried so far:

1. we checked what data is saved into the const selectedEmotionType 2. we tried to access the specific name via selectedEmotionType.type.name

feature/backend-update-delete-new

US Backend Updated / Delete

Any help or suggestions would be greatly appreciated!

[Roland-Hufnagel]

Hey team. Please try the following:
in EmotionForm please go back to the previous version you had before (id instead of name):

  const [selectedEmotionType, setSelectedEmotionType] = useState(
    defaultValue?.type.id || undefined
  );

Also change this part back to previous (use value instead of defaultValue):

              value={selectedEmotionType}
              //defaultValue={defaultValue?.type.name || ""}

then add the 'selected' attribute to the option:

  <option
                  key={emotion._id}
                  value={emotion._id}
                  selected={defaultValue?.type.name === emotion.name}
                >
                  {emotion.name}
                </option>