anon9372508
Generating clientside validation on inputs from ecto schemas/changesets
I’m looking for feedback on my idea of how I can possibly build a solution to creating client side dom validations using a changeset.
Before you say x framework, let me just stop you right here.
The primary focus of this convo I would like to keep to that of just conceptual ideas around the following:
- Create ecto schemas validations like we already do.
- Generate some data that describes these validations and package that along side or in a changeset
- Update the core components input functions to make use of this validation data and generate client side input validations like (required, minlength, pattern ect)
First has anything like this already been tried, done?
Second outside of the fanboyism for liveview/ash/hologaram/vue/svelte/x/y/z whats your take?
Personally I’m kind of shocked to not already see something that sets the required of an input by default even if just as a common pattern.
Most Liked
LostKobrakai
Ecto already does that: Ecto.Changeset — Ecto v3.13.4
Those attributes have footguns as well. E.g. if you have a required attribute on an input hidden by some UI like tabs or disclosure the form simply won’t submit without any feedback to the users what’s wrong.
Last Post!
dimitarvp
I’ve seen a good amount of websites deal with this simply by putting an error at the top of the form without it being attached to any input field. Some of them also auto-scrolled you to the top of the form and did a short blinking effect on the error message as well.
Not to invalidate your point, I am pointing out that it’s an old problem and enough people shrugged it off with “Well, not every error belongs to a singular field. Some errors introduce a holistic form-wide error so let’s show the users that.”.
Popular in Discussions
Other popular topics
Latest on Elixir Forum
Sponsor Spotlight
Catch errors, track performance, monitor hosts and more.
Categories:
Sub Categories:
Forums
Popular Tags
- #ecto
- #liveview
- #troubleshooting
- #learning-elixir
- #deployment
- #library
- #erlang
- #testing
- #genserver
- #mix
- #absinthe
- #remote-other
- #otp
- #plug
- #how-to-question
- #macros
- #postgres
- #channels
- #elixirconf
- #exunit
- #discussion
- #code-sync
- #javascript
- #podcasts
- #onsite
- #dialyzer
- #docker
- #authentication
- #umbrella
- #full-time-contract
- #podcasts-by-brainlid
- #ecto-query
- #elixir-ls
- #phoenix_html
- #iex
- #blog-post
- #graphql
- #genstage
- #ai
- #websockets
- #supervisor
- #elixirconf-us
- #advent-of-code
- #distillery
- #processes
- #forms
- #api
- #metaprogramming
- #security
- #hex
Our Sponsors
Build Elixir applications with speed and confidence.
Supporting innovation across the BEAM ecosystem.
We build reliable cloud platforms for business-critical systems.
Catch errors, track performance, monitor hosts and more.
Error tracking for Elixir devs who love to ship. Start your free account.
Develop your skills with books, videos, and courses.
Enabling companies to succeed by building software people love.
The deployment platform built for Elixir: PaaS ease, VPS control.
The team behind Membrane, Popcorn, LiveDebugger. Available for hire.
Courses that'll move you from confusion to "Aha, now I get it!"