How can i make the input lowercase
Unanswered
Banana posted this in #help-forum
BananaOP
How can i make it so the input is automatically lowercase only (and if the user is using capitals it makes it lowercase and stuff
<Input
{...register('password')}
type='password'
className={cn({
'focus-visible:ring-red-500':
errors.password,
})}
placeholder='Password'
/>33 Replies
to be clear… this can also be easily chat gpt’d… but i feel bad that you are poking in the dark so many times so i am gonna answer
you need a controlled value and an onChange function
BananaOP
alright
do you understand what this means?
BananaOP
not really 💀 but imma just google it
cool. in your onChange, you can validate/modify/etc your logic however you want
alternatively, if you are comfortable with regex you can set constraints
BananaOP
alright
i will try smt
@Banana i will try smt
can you put numbers?
BananaOP
yeah
and symbols?
BananaOP
no
so should i use regex?
so just letters and numbers?
BananaOP
yeah
whats the min and max
BananaOP
min 3 max 20
try adding pattern="[a-z0-9]{20}"
it wont stop the input
but it will trigger that its invalid
BananaOP
i could just prob put that in my account validator
generally, you do not want to stop or change the user’s input
instead you tell them their input is shit and why it shit
in a popup
(but nicer 😜)
BananaOP
yeah
however, if you want to anyway, the onChange will let you do that
BananaOP
username: z.string().min(3, {
message: "Username must be atleast 3 characters long."
})Imma just modify this to show an error if the username has symbols and stuff
ah yeah you are using zod
thats the smarter way. good man.
thanks