I have 2 select form elements named client and matter. The first is populated by PHP; the second is populated using an Ajax call, depending on the client entered. This all works okay. What I want is when a matter is selected to get a balance figure using Ajax, which depends on the cid and mid.
Since cid is out of range for the second Ajax call I have repeated the assignment, but it always seems to return an empty string (or null).
Where am I going wrong?
Here is my JS:
const clist = document.getElementById("client");
const mlist = document.getElementById("matter");
clist.addEventListener("change", function() {
const cid = clist.options[clist.selectedIndex].value;
fetch("getMatters.php?c="+cid)
.then (response => {
mlist.innerHTML = "Waiting for response...";
if (response.ok)
return response;
throw Error(response.statusText);
})
.then (response => response.text())
.then (text => mlist.innerHTML = text)
.catch (error => console.log("There was an error:", error))
});
const clbal = document.getElementById("balance");
const cid = clist.options[clist.selectedIndex].value;
mlist.addEventListener("change", function() {
const mid = mlist.options[mlist.selectedIndex].value;
fetch("getCLBalance.php?c="+cid+"&m="+mid)
.then (response => {
clbal.value = "Waiting for response...";
if (response.ok)
return response;
throw Error(response.statusText);
})
.then (response => response.text())
.then (text => clbal.value = text)
.catch (error => console.log("There was an error:", error))
});
FWIW I have my half-working code here gand al f458. co.u k/vir go/virg o1.php
