• Empleos
  • Sobre nosotros
  • profesionales
    • Inicio
    • Empleos
    • Cursos y retos
    • Preguntas
    • Profesores
  • empresas
    • Inicio
    • Publicar vacante
    • Nuestro proceso
    • Precios
    • Pruebas Online
    • Nómina
    • Blog
    • Comercial
    • Calculadora de salario

0

158
Vistas
Proper way to "pre-validate" html input according to specific locale(formik included)

I need to pre-validate my inputs according to locale and defined "format type". For example: In some cases, it will be possible to enter only int values, in other cases it may be float, but with specific decimal places and so on.

What did I have for now:

  1. type = 'text', custom checks, formik problems. Input type='text' allows me to perform any checks I want in "onKeyPress" and other events. But the problem is - formik redrawing the input after each change and in case of entering Decimal separator, it will be erased(just because after the formik's setFieldValue 999. (or even 999.0) becomes 999). As I see it now, I can add a lot of ugly code inside custom Formik, but I feel like there is better way..

  2. type='number', locale problems. It allows browser to do most of the work using type='number': This works much better, I still can use events that I want, but the problem is even using my locale(en-US), it does not allow me to enter "." as a decimal separator, but allows me to use "," only.

There is also pattern attribute, but it can not be used with "number" inputs, so we have same problems like in the first case.

As for the showing - dynamically switching to "text" and showing formattted text with "Intl.NumberFormat" works pretty good.

I really feel like "reinventing the wheel", but there should be already invented one...

almost 3 years ago · Juan Pablo Isaza
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Nuestro proceso Comercial
Legal
Términos y condiciones Política de privacidad
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recomiéndame algunas ofertas
Necesito ayuda