How to use default value on Select Forge Component?

Forge Forge UI Kit and Custom UI
,
1

I want to create like issue picker using Select component. I already got the value and display it to the custom field. But if I want to edit the value after I click the custom field, the value is missing. How can I use default value in Select component?
Here’s the code that I’ve done so far

  const [defaultFieldValue, setDefaultFieldValue] = useState([]);


  useEffect(() => {
      if (context && context.extension && context.extension.fieldValue) {
        const data = context.extension.fieldValue.issues || [];
        const issues = data.map(issue => ({
          label: `${issue.key}`,
          value: `${issue.id}|${issue.key}`,
        }));
        setDefaultFieldValue(issues);
      }
  }, [context]);

        <Select
          onInputChange={(e) => setFieldValue(e)}
          options={issueOptions}
          defaultValue={defaultFieldValue}
          isMulti
          placeholder="Pick Issue(s)"
          {...register("issuePicker")}
        />
2

Hi @calvinnugroho ,

I suspect you may have to ensure the Select component is rendered the first time only after defaultFieldValue has been updated.

Regards,
Dugald

1 Like
3

Hi @calvinnugroho,

How did you ensure select component is rendered after setting default values?
I am having similar issue with textfield. The text value is rendered before default value variable is set.

Thanks,
AP