How can I determine if change event occurred from user input?

Question

I have a dynamic form that updates based on user selected values.

One particularly input field (type number) I calculated a default value for and update. But if the user every selects their own value, I want to respect that and not re-calculate the default as they continue filling out the form.

What would be the best way to detect a user input vs my programs input?

I thought about onclick events but want to respect if they use the keyboard to enter. I thought about an on change event, but since my program recalculate the value frequently that won't work.

I found this answer that has ideas for C# fields Determine If Changed Event Occurred from User Input Or Not

I found this answer that talks about using the input event - Detecting input change in jQuery? - which seems like it could work but would fire on every key stroke which seems less than ideal.

Answer 1

What do you think if you set a "keydown" event on the input. And if your script changes the value than you just use "element.value = "Foo"?

Answer 2

Here's an idea that doesn't require hefty code interventions or a large number of event triggers: add a focousout or blur event (whichever fits the needs of your page better) to your input which, when triggered, will take the input's value and compare it to your calculated default. If different, it would mean the user has selected a different value. You could then store the user's value in a hidden element (a simple span will do the trick).

Next time you recalculate your default, you could check if your hidden element has any content and then not replace the value in your input. Or you could check the content of the hidden span containing the user's input before you run the recalculation and avoid it altogether.

That would be a solution that does not change the user interface. If possible, the simplest solution would be adding a checkbox that allows the user to define their own value.