I’m working in the inputCapture.js file in the github project here => math_app
Install node modules and run the project with npm start.
I’m trying to capture the input immediately and move it through validation. Unfortunately the input is always a step behind what the user has written.
If the user enters 1 the console logs ‘’
If the user enters 18 the console logs ‘1’ etc
I want the validation to be automatic, not on keypress.
This is the biggest problem, although there are other problems. Can anyone tell me if there is a way to correct this browser lag? Would love for the user to type in the answer and for it to be validated.
Just to clarify, if a user enters
2 in the right bottom field, are you wanting the
2 to display in the console before or after the validation?
If the two numbers were:
what are you wanting to happen if the user first types a
1 in the right bottom field?
and what should happen if the user continues typing a
2 in the same field?
The sum of
12 but I would assume you just want the user to enter
2 in this field (only allowing a single digit in each of the bottom fields). Is that correct?
Hi Randall thanks for your response.
I have a large number (always top) and a small number.
When the user adds the top and bottom digit an if statement will check if the answer matches the addition of the large and small unit. If true it will run the code. Currently that isn’t happening. I believe that when the user has typed in the value, the browser doesn’t validate until the the enter key is pressed. When the enter key is pressed the value is updated…
user types in 5 in digit input and the tens input opens up.
User types in 14 in the input, the 1 gets carried leaving the 7 in the digit input and opening up the 10s input…
It’s almost there. I was using the enter key which was fine, but it wasn’t validating as the user went and I thought it might be better to validate step by step without the user having to press enter…
I would use the
keyup event here instead. Also, you do not even need the
updateValue function as the value gets updated when the user types.
The real issue is the following line:
arr = value.split('')
Because you initialized
value to be
0 when you declared it as a global variable in the following line:
let value = 0;
you can not split it. I think what you intended to do was split
event.target.value instead which would be the value entered. When I made that change, your code appears to work as intended when entering a value into the bottom right field.