0

Hello I need to change the event.target.value with an input and that input has 8 character min rule. I'm currently doing like this(example) in a component react js:

              <input
              ...
              minLength={8}
              onChange={(e) => {
                onChangeHandler(e);
              }}

          />

Where in the onChangeHandler i'm doing this

e.target.value = 'less8';
console.log(e.target.checkValidity());

However when i call checkValidity it's returning 'true', but i was expecting 'false'.

I debugged this and it's because when i assigned a value into 'e.target.value' the function 'e.target.checkValidity()' does not work anymore.

Does anyone have another way to assign a value to 'e.target.value' and still make 'checkValidity()' work?

2
  • Ah ok thanks! It looks like there's another attribute I can use called 'pattern' which works! It's strange that 'minLength' does not work when using JS to simulate user interaction Commented Mar 13, 2022 at 18:56
  • Problem is I have many components that uses 'minLength', I would have to go through each one and change it to 'pattern' attribute :-( Commented Mar 13, 2022 at 19:05

0

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.