foolish-indigoF
Refine2y ago
16 replies
foolish-indigo

Modifying data on an edit page before updating

I have a field where the user enters a phone number that's formatted into an object using "antd-phone-input" as a dep. Registering a user and entering the phone number works no problem, but how can I update the phone number on the edit page?

import PhoneInput from 'antd-phone-input';
import { formatPhoneNumber } from '../../utility/formatPhone';

return (
<CanAccess fallback={<NoPermission />}>
<Edit saveButtonProps={saveButtonProps} title={`Edit ${postData?.full_name}`}>
<Form {...formProps} layout='vertical' onFinish={handleOnFinish}>
<Row gutter={{ xs: 8, sm: 16, md: 24, lg: 32 }}>
<Col span={8}>
<Form.Item
label='Full name'
name='full_name'
rules={[
{
required: true,
},
]}
>
<Input disabled={role === 'user'} />
</Form.Item>
</Col>

<Col span={8}>
<Form.Item
label='Email address'
name='email'
rules={[
{
required: true,
},
]}
>
<Input disabled={role === 'user'} />
</Form.Item>
</Col>
<Col span={8}>
<Form.Item label='Phone' name='phone' rules={[{ validator }]}>
<PhoneInput enableSearch={false} disableDropdown />
</Form.Item>
</Col>

{
// Other fields...
}
</Row>
</Form>
</Edit>
</CanAccess>
);
};
Was this page helpful?