jQuery - On Input

By using on() and specifying the input event, you can detect when the value of an input in the UI is changed in the browser...by a user.

This works great when a user types in a field. There's a catch. If you try to change it programmatically, it will not trigger the input() event. Notice that the button does NOT trigger the alert for input's change.

https://stackoverflow.com/questions/37686861/input-event-not-working-if-value-is-changed-with-jquery-val-or-javascript

To do this, you must manually trigger the input method.

$(document).ready(function ()
{
    $("#TestInput").on("input", function () { alert("input was changed...."); });
    $("#ChangeInputButton").click(function () { UpdateInput(); });
    $("#ChangeInputButton2").click(function () { UpdateInput2(); });
});

const UpdateInput = () =>
{
    alert("Changing input value...");
    $("#TestInput").val("Foobar!");
};

const UpdateInput2 = () =>
{
    alert("Changing input value 2...");
    $("#TestInput").val("Foobar!").trigger("input");
};