Resume
/
subman-nextjs
2
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

give each genrePicker cell a unique form id

This commit is contained in:
andrzej 2024-07-24 22:01:20 +02:00
parent cd90c92c6d
commit 5abfdf14fd
1 changed files with 8 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
src/app/ui/tables/inputs/genrePickerInput.tsx
View File

@ -24,7 +24,7 @@ export default function GenrePickerInputCell(props: CellContext<any, any>) {
const genres = props.table.options.meta.genres const genres = props.table.options.meta.genres
const [isActive, setIsActive] = useState(false) const [isActive, setIsActive] = useState(false)
async function onSubmit({ genres }: { genres: number[] }, event: Event) { async function onSubmit({ genres }: { genres: number[] }) {
event.preventDefault() event.preventDefault()
const genresArray = genres.map((e) => { return { id: e } }) const genresArray = genres.map((e) => { return { id: e } })
console.log(`genres: ${genres}, genresArray: ${JSON.stringify(genresArray)}`) console.log(`genres: ${genres}, genresArray: ${JSON.stringify(genresArray)}`)
@ -42,7 +42,7 @@ export default function GenrePickerInputCell(props: CellContext<any, any>) {
// genres: genresArray, // genres: genresArray,
// pathname // pathname
// }) // })
// setIsActive(false) setIsActive(false)
} }
function onErrors(errors) { function onErrors(errors) {
@ -65,11 +65,14 @@ export default function GenrePickerInputCell(props: CellContext<any, any>) {
genres: value.map(e => e.id) genres: value.map(e => e.id)
} }
}) })
const formId = "editGenresForm" + props.cell.id
return ( return (
<Form {...form}> <Form {...form}>
<form onSubmit={form.handleSubmit(onSubmit, onErrors)} id="editGenresForm"> <form onSubmit={form.handleSubmit(onSubmit, onErrors)} id={formId}>
<Popover modal={true}> <Popover modal={true} open={isActive} onOpenChange={() => setIsActive(prev => !prev)}>
<FormField <FormField
control={form.control} control={form.control}
name="genres" name="genres"
@ -119,7 +122,7 @@ export default function GenrePickerInputCell(props: CellContext<any, any>) {
}} }}
/> />
))} ))}
<Button variant="ghost" form="editGenresForm">Submit</Button> <Button variant="ghost" form={formId}>Submit</Button>
<Button variant="link" className="p-0" onClick={() => form.setValue("genres", [])}>Clear</Button> <Button variant="link" className="p-0" onClick={() => form.setValue("genres", [])}>Clear</Button>
</PopoverContent> </PopoverContent>
<FormMessage /> <FormMessage />