I have two input fields, both of them have onchange
event listener added to them:
HTML
<input type="number" size=5 style="width:80px;" id="funit" autocomplete="off" required>
<input type="number" size=5 style="width:80px;" id="tunit" autocomplete="off" required>
JAVASCRIPT
document.getElementById("funit").addEventListener("change",f1);
document.getElementById("tunit").addEventListener("change",f1);
function f1(){
var funit=document.getElementById("funit").value;
var tunit=document.getElementById("tunit").value;
if(funit.toString()!="" && tunit.toString()!=""){
if(funit>tunit){
alert("incorrect units");
document.getElementById("funit").value="";
document.getElementById("tunit").value="";
}
}
}
Now I have another function which fetches the values from a row of a table and inserts them into the fields. Like for example:
funit=6;
tunit=7;
Now if I add a 0 along with the input in funit
, i.e., if I make it 60, then it should trigger the onchange
listener, but it doesn't. Only when I erase both the input fields, and then type again, does the event listener get triggered. Why so? How do I fix this?