Simplify your stack and build anything. Or everything.
Build tomorrow’s web with a modern solution you truly own.
Code-based nature means you can build on top of it to power anything.
It’s time to take back your content infrastructure.

Hello guys, in our company we always had form vali...

discord user avatar
tylandavis
last year
9

Hey

@316284612340875274

, can you tell me a little bit about how you are setting up your forms?



Are you using

plugin-form-builder

by chance?

  • default discord avatar
    dzordz.last year

    Yes I do, i marked some fields as required but I did not 'get' them from backend. Im testing forms on some old app (formik inputs), so I only send my data to api URL but the submission is always successfull.

  • discord user avatar
    tylandavis
    last year

    I would say it's a good idea to validate on the frontend, that way the the user is able to see the errors before a request to the API is made. You can add a

    required

    attribute to your inputs that will be applied only if the field is marked required, like so:



    <input type="text" required={field.required} />
  • default discord avatar
    dzordz.last year

    Many thanks, it was just weird for me to validate forms on frontend. In my workplace backend always did it. Can you tell me how secure is that? Do you always validate on frontend?

  • discord user avatar
    tylandavis
    last year

    Regarding security, the more validation the better. If you still want to validate on the server, that's possible as well.



    One way you can do this is to create an endpoint in your Payload app to check validity, and create a new form-submission if it passes. Then you would send your data to your custom endpoint instead of to your

    api/form-submissions

    endpoint. You can then use the overrides in the plugin to set the access control to not allow create operations on your form-submissions collection. From your custom endpoint you can use the Local API to create forms-submissions.



    More on Custom Endpoints here:


    https://payloadcms.com/docs/rest-api/overview#custom-endpoints
  • default discord avatar
    dzordz.last year

    Awesome, many thanks for help!

  • discord user avatar
    tylandavis
    last year

    You're welcome!

  • default discord avatar
    _veth_last year

    Let me hop in because this is my concern also. Is there any danger to only validate on frontend? Maybe validating simple contact form input on backend is just too much.

  • discord user avatar
    jacobsfletch
    last year

    The right way to do this would be to have Payload itself validate all form submissions when they are created. There would be no need for custom validation endpoints, no reliance on front-end validations, just try and save a document and Payload will reject it if necessary. All forms on the web really should have

    both

    front-end

    and

    backend validations. This was always possible to wire in yourself as

    @783701636165402624

    describes but in reality you should not have to do anything extra on top of the existing validations that you'd normally write into your Payload config. This is something we were always planning on doing, there's even a little code comment indicating exactly where this would be written, but it has not been done yet. I went ahead and opened a ticket just now for this so we can ensure track progress:

    https://github.com/payloadcms/plugin-form-builder/issues/50
  • default discord avatar
    _veth_last year

    Thanks for in depth explanation!

Star on GitHub

Star

Chat on Discord

Discord

online

Can't find what you're looking for?

Get dedicated engineering support directly from the Payload team.