FormKit: Form building framework for Vue 3

I love these sorts of frameworks! Makes doing forms a lot nicer, especially the live validation.<p>I feel like the next evolution is automatically generating a whole form from selecting a schema in an OpenAPI spec.<p>In a lot of specs, the type (string, email, phone, int, etc) is present along with any constraints (min&#x2F;max length). Depending on the language&#x2F;OpenAPI generator, it even preserves field order. It could massively speed up a lot of the more generic forms that happen in frontend.

The product and the website are really slick, but there is nothing about who made this other than &quot;FormKit, Inc.&quot; in the footer. Is this a group, an individual, a subsidiary, or what?

I was just talking about this with a colleague. We really want to join the beta at my company. Would be happy to sign up for the pro plan!<p>One note though, I want to point out, that I am able to &quot;break&quot; some of the demo components, like changing type=&quot;number&quot; doesn&#x27;t seem to error the form when I input text over it.<p>In case one of the other maintainers sees this, I have one other question:<p>Does this in any way use `eval`? I know a lot of JSON schema validators do, and that is a pain when it comes to CSP. If Formkit doesn&#x27;t use eval (and maybe we can get a commitment on that...) its a no brainer

Whenever I see these form frameworks the first thing I do is click the label to ensure it focuses the input field. Aaaand pass, good job!

I personally use that lib: <a href="https:&#x2F;&#x2F;github.com&#x2F;openizr&#x2F;gincko" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;openizr&#x2F;gincko</a> Still in beta, but quite stable though.

Looks very good, but if I read validation docs correctly there is no built-in validation for group of fields, like range of dates or product price range. Or even more complex where third field, type of product, defines lower boundary for product price range.<p>This means you have to somehow hook up into input&#x2F;validation events for each field, add validation manually and then try to put errors in the right fields even if that is not the last modified field.

I&#x27;ve used VueFormulate in the past, and it was extremely powerful albeit somewhat bloated. FormKit seems like a step in the right direction. Good Luck!

Looks really interesting. We’re using a hand rolled solution on top of JSON schema but it’s pretty unforgiving and sometimes requires very invasive changes to add support for new requirements. One thing I didn’t get a good grasp on from the examples is what the error responses should look like from the server. I would love to use this as the per field and error groups are a very nice feature IMO.

Is there something like this for bootstrap?

Very impressive. The schema covers everything I need. This library desperately needs &quot;Repeater&quot; component which I assume would handle array of inputs. This would allow FormKit to handle the most complex forms which is where this library would help the most.

FormKit (formerly VueFormulate) team is the most responsive to issues I&#x27;ve ever encountered. Superb documentation and easy to understand apis.<p>If only all third-party packages&#x2F;apps were as pleasant to work with as the ones put out by FormKit team.

What would be the advantage over creating forms (using jotform etc) and embedding them in apps as anywayz people wouldn’t want to take control over or engineer forms much.

Why people keep inventing new schema formats? JSON Schema is not perfect but you can extend it to achieve all of what&#x27;s in this schema format.

On a slightly related note, does anyone know of a form library like this one with first class support for a drag and drop form builder interface?

What&#x27;s the difference between Free and Pro?

I wish more frameworks or tools offered a landing page as good as this project.

I used vue for a project and encountered a gnarly bug - I have a component which can embed itself recursively, and I pass some variables through the stack to communicate to the root. But if I nest 3 components deep, it actually hangs the tab and crashes chrome! Can’t even debug! Not sure how to even recreate it in a way that’s not proprietary and hence can’t file a bug as well.