Question
Facing Error Blocked form submission to '' because the form's frame is sandboxed and the 'allow-form
Hello, I am a beginner and I am facing one issue when I used
@adobe/react-spectrum form or formik.
Does anyone have any idea regarding this?
Thanks in advance.
Here is my code.
Does anyone have any idea regarding this?
Thanks in advance.
Here is my code.
Formik form example
<form
onSubmit={(e) => {
e.preventDefault();
handleSubmit();
}}
noValidate
>
<Grid
areas={["content content", "footer footer"]}
gap="size-100"
>
<View gridArea="content">
<TextField
label="Title"
data-testid="title"
name="title"
value={values.title}
onChange={handleChange}
onBlur={handleBlur}
isRequired
// isInvalid={isValid}
errorMessage={errors.title}
UNSAFE_className="fullWidth"
/>
<TextArea
label="Description"
name="text"
value={values.text}
onChange={handleChange}
onBlur={handleBlur}
isRequired
minLength={10}
errorMessage={errors.text}
UNSAFE_className="fullWidth"
/>
</View>
<View gridArea="footer">
<Button
variant="accent"
UNSAFE_className="fullWidth"
style="fill"
marginBottom={2}
type="submit"
onPress={(e: any) => {
console.log("🚀 ~ ManageVideo ~ e:", e);
// e.preventDefault();
}}
>
Generate AI Video
</Button>
<Text marginY={25}>
{`You have ${0} video credits left in Oxolo`}
</Text>
<Button
UNSAFE_className="fullWidth"
variant="secondary"
style="fill"
onPress={() => {
handleLogout();
}}
>
Sign out
</Button>
</View>
{/* <Flex direction="row" height="size-800" gap="size-100">
<View backgroundColor="celery-600" width="size-800" />
<View backgroundColor="blue-600" width="size-800" />
</Flex> */}
</Grid>
</form>
Normal form
<Form validationBehavior="native" maxWidth="size-3000">
<TextField label="Email" name="email" type="email" isRequired />
<ButtonGroup>
<Button type="submit" variant="primary">
Submit
</Button>
<Button type="reset" variant="secondary">
Reset
</Button>
</ButtonGroup>
</Form>
