Can't reset antd select field by name

Viewed 261

I am using Ant Design. I have a dropdown in a table:

     .......
     render: (_text: any, _record: ResponseCode, index: any) => {
            console.log({ form: form.getFieldsValue(), index });
            return (
              <>
                <button
                  onClick={() => {
                    form.resetFields([
                      `rcForm_payportalExternalResponseCodes_${index}`,
                    ]);
    
                    dispatch(setResponseCodeData(undefined));
                    buttonDisabled[index] = true;
                  }}
                >
                  Reset
                </button>
                <Form form={form} name="rcForm">
                  <SelectInput
                    name={['payportalExternalResponseCodes', index]}
                    className="tpp-borderless-input"
                    placeholder="Select Response Code"
                    bordered={false}
                    dropdownStyle={{ minWidth: 350 }}
                    options={responseCodeOptions}
                    onSelect={(val) => {
                      dispatch(
                        setResponseCodeData({
                          payportalExternalResponseCodes: val as number,
                          mapped: true,
                        })
                      );
                      buttonDisabled[index] = false;
                      console.log('value', value);
                    }}
                    onClear={() => {
                      console.log('_record', _record);
                      dispatch(setResponseCodeData(undefined));
                      buttonDisabled[index] = true;
                    }}
                    onChange={(value) => {
                      console.log(value);
                    }}
                  />
                </Form>
              </>
            );
          },
        },
......

I want to reset the value of only one field: enter image description here

I tried with:

 onClick={() => {
    form.resetFields([`rcForm_payportalExternalResponseCodes_${index}`]);

 }}

But nothing happens. How can I achieve to reset the value of the individual select field?

0 Answers
Related