CODEWITHSUNDEEP
javascriptreactjstypescriptantd
Feisser
Feisser

Reputation: 21

React Typescript: Antd Checkbox value not working

Hello im trying to fill the Checkbox value with my state but it dont accept it.

The Checkbox Code:

<Form.Item label="Aktiv" >
    <Checkbox value={this.state.selectedRecord.active} />
</Form.Item>

Value of the state selectedRecord: enter image description here

Upvotes: 1

Views: 1373

Answers (2)

splashout
splashout

Reputation: 544

The AntD documentation here says to the question "Why not work in Form.Item?":

"Form.Item default bind value to value property, but Checkbox value property is checked. You can use valuePropName to change bind property."

So, you could try:

<Form.Item label="Aktiv" valuePropName="checked">
    <Checkbox value={this.state.selectedRecord.active} />
</Form.Item>

But it still doesn't work for me for some reason, so I used something like this:

<Form.Item label="Aktiv" name="aktiv">
    <Checkbox />
</Form.Item>

and this to set it checked or unchecked:

form.setFieldValue('aktiv', {this.state.selectedRecord.active});

Upvotes: 0

Benjamin Kile
Benjamin Kile

Reputation: 151

try changing it to this.

<Checkbox checked={this.state.selectedRecord.active} />

Upvotes: 5

Related Questions