INERTIA FEILD IS NOT RESETTING

export default function CreateSlotModal({ channel }) { const { show, toggleShow } = useModal(); const { data, setData, post, processing, errors, reset } = useForm({ title: "", type: "", price: "", duration_type: "", duration_value: "", description: "", visibility: "", });

const handleChange = (event) => {
    setData(
        event.target.name,
        event.target.type === "checkbox"
            ? event.target.checked
            : event.target.value
    );
};

const submit = (e) => {
    e.preventDefault();
    post(route("slot.store", channel), {
        onSuccess: () => {
            reset();
            toggleShow();
        },
    });
};

return (
    <React.Fragment>
        <Button onClick={toggleShow}>Create Slot</Button>
        <Modal
            position={"top-center"}
            show={show}
            onClose={toggleShow}
        >
            <Modal.Header>Create Slot</Modal.Header>
            <Modal.Body>
                {channel.title}
                <form
                    onSubmit={submit}
                    action=""
                    className="flex flex-col gap-4"
                >
                    <InputRow label="Title" error={errors.title}>
                        <TextInput
                            id="title"
                            type="text"
                            name="title"
                            placeholder="slot title"
                            required={true}
                            value={data.title}
                            onChange={handleChange}
                        />
                    </InputRow>

                    <InputRow label="Price" error={errors.price}>
                        <TextInput name="price" onChange={handleChange} />
                    </InputRow>
                    <InputRow label="Description" error={errors.description}>
                        <Textarea
                            name="description"
                            placeholder="Tell your buyer about your slot"
                            rows={3}
                            onChange={handleChange}
                            value={data.description}
                        ></Textarea>
                    </InputRow>
                    <div className="grid grid-cols-1 gap-4 md:grid-cols-2">
                        <InputRow label="Duration value" error={errors.duration_value}>
                            <TextInput name="duration_value" onChange={handleChange} />
                        </InputRow>

                        <InputRow label="Duration Type" error={errors.duration_type}>
                            <Select
                                onChange={handleChange}
                                value={data.duration_type}
                                name="duration_type"
                            >
                                <option value="">duration type</option>
                                <option value="year">year</option>
                                <option value="month">month</option>
                                <option value="day">day</option>
                                <option value="hour">hour</option>
                                <option value="minute">minute</option>
                                <option value="seconds">seconds</option>
                            </Select>
                        </InputRow>

                        <InputRow label="Visibility" error={errors.visibility}>
                            <Select
                                onChange={handleChange}
                                value={data.visibility}
                                name="visibility"
                            >
                                <option value="">select visibility</option>
                                <option value="draft">draft</option>
                                <option value="public">public</option>
                            </Select>
                        </InputRow>
                    </div>
                    <div className="flex space-x-3">
                        <Button type="submit">Create</Button>
                        <Button
                            color="gray"
                            onClick={toggleShow}
                        >
                            Decline
                        </Button>
                    </div>
                </form>
            </Modal.Body>
        </Modal>
    </React.Fragment>
);

}

@horlatech I assume it's price? Yet I cannot see data.price anywhere?

@Sinnbeck yes, I don't put it now but can that affect it

@horlatech no? But what field is it then?

@Sinnbeck thanks so much, this is awesome. but how are you able to identify it so quickly, I spent a lot of time trying to fix it. thanks. don't mind if you can mentor me

@horlatech did it get solved? Just took the first "number" field but could not find any usages of it. Just assumed it had something to do with it. But just a shot in the dark.

Feel free to ask away on this forum. I answer on most threads (especially react/inertia stuff)