search

ciscoheat / sveltekit-superforms

Making SvelteKit forms a pleasure to use!
https://superforms.rocks
MIT License
2.12k stars 62 forks source link

Superforms with GridStack #456

Open gosongying opened 1 month ago

gosongying commented 1 month ago

Description When forcing client-side validation when the input loses focus, setting 'onblur' for validationMethod does not seem work, while 'oninput' does work. The input element comes from shadcn-svelte Form component. It acts exactly the same as the default method.

If applicable, a MRE superForm(serverForm, { dataType: 'json', validators: schemasafeClient(schema), id: id, validationMethod: 'auto' }); this is the code I use to construct the form on client side.

ciscoheat commented 1 month ago

I'd need a MRE on SvelteLab to investigate further, without shadcn-svelte preferably, as components can easily complicate things.

gosongying commented 1 month ago

Hi, sorry for the late reply, i think i have figured out the issue, it is because i am using superform along with GridStack, seems they are not compatible? Do you have any suggestion?

ciscoheat commented 1 month ago

I have never used GridStack, sorry. We can change this thread to be about how to integrate it.

gosongying commented 4 weeks ago

The input element indeed loses focus when I click outside of it, as confirmed by checking document.activeElement. However, the client-side validation isn't being triggered. I suspect that Gridstack might be interfering with the element being properly detected, as the validation works correctly when Gridstack isn't used.

gosongying commented 3 weeks ago

Could you explain the underlying logic or method you use to detect if an input element is focused?