lz-onchange

The attribute lz-onchange is used to specify a function name (which can be fully qualified) to call when the value of the reactive element changes, acting as a callback function.

The function can expect two parameters: the new updated value and the element which caused the change. If the change was not caused by the element specified in lz-source, the second parameter will be null.

Note that this function gets called only when the variable changes and not when it gets set, meaning that the first call to LZ.setValue() or any of its variations does not trigger it, unless you pass true to the forceChange parameter of the setter functions. You can check LZ.setValue() for more info.

Leeze.js does not enforce a specific function signature, neither does it check that the function expects parameters.

An example:

...
<p lz-reactive lz-source="my-input-element" lz-onchange="myCallbackFunction"></p>
<script>
    function myCallbackFunction() {
        console.log("The paragraph content has changed!");
    }
</script>

One can also use these other function signatures:

function myCallbackFunction(newValue) {
    console.log("The paragraph content has changed to ", newValue);
}

function myCallbackFunction(newValue, sourceOfChangeElement) {
    console.log("The paragraph content has changed to ", newValue, " by the element ", sourceOfChangeElement);
}