CODEWITHSUNDEEP
javascriptreactjsantd
Dmitry Ezhov
Dmitry Ezhov

Reputation: 325

Setting initial values to dynamic form in antd 4

I have a problem while creating dynamic form in antd4, following this example from docs.

I want to use dynamic form to edit object which already has some values.

In this sandbox I created a new array of initial values: https://codesandbox.io/s/dynamic-form-item-ant-design-demo-slm8o?file=/index.js:636-649

The goal is to achieve this state when opening form:

enter image description here

Grateful for any help.

Upvotes: 8

Views: 17170

Answers (2)

Raiyad Raad
Raiyad Raad

Reputation: 537

<Form
 form={buildingForm}
 onFinish={onFinishBuildingCreate}
 initialValues={{
  officesInfo: [
   { office_type: "Head Office", employee: 0 },
  ],
}}
>

Upvotes: 1

oozywaters
oozywaters

Reputation: 1241

You need to pass an object to initialValues prop, that contains an array of values for names field list, like so:

    <Form
      name="dynamic_form_item"
      initialValues={{ names: ['', '', ''] }}
      {...formItemLayoutWithOutLabel}
      onFinish={onFinish}
    >
        <Form.List name="names">
            { /* your array of fields goes here */ }
        </Form.List>
    </Form>

Upvotes: 19

Related Questions