I have a javascript that runs using the onchange event when a user enteres a value into an input box.
The script is
<script type="text/javascript">
function showUser(userNumber, str)
{
if (str=="")
{
document.getElementById("txtHint" + userNumber).innerHTML="";
return;
}
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
//document.getElementById("txtHint" + userNumber).innerHTML=xmlhttp.responseText;
var responseText = xmlhttp.responseText;
var description = responseText;
var warehouse = "";
var sellingUnits = "";
if (responseText.indexOf("NOT A VALID") == -1)
{
description = responseText.substring(12, responseText.indexOf(",Warehouse:"));
warehouse = responseText.substring(responseText.indexOf(",Warehouse:")+11, responseText.indexOf(",SellingUnits:"));
sellingUnits = responseText.substring(responseText.indexOf(",SellingUnits:")+14);
}
document.getElementById("whse" + userNumber).innerHTML = warehouse;
document.getElementById("txtHint" + userNumber).innerHTML = description;
document.getElementById("su" + userNumber).innerHTML = sellingUnits;
}
}
xmlhttp.open("GET","getdata1.php?q="+str,true);
xmlhttp.send();
}
</script>
and the form is
<form name="orderform" id="orderform" action="newsale.php" method="post">
<table border=1>
<tr>
<td>Product Code</td>
<td>Description</td>
<td>Warehouse</td>
<td>Selling Units</td>
</tr>
<tr id="r1">
<td width=100>
<input size=10 type=number id=sku1 name=sku1 value="1182" onchange="showUser(1, this.value)">
</td>
<td width=280>
<div align="left" id="txtHint1"> </div>
</td>
<td width=100>
<div align="left" id="whse1"> </div>
</td>
<td width=100>
<div align="left" id="su1"> </div>
</td>
</tr>
<tr id="r2">
<td>
<input size=10 type=number id=sku2 name=sku2 value="1183" onchange="showUser(2, this.value)">
</td>
<td>
<div align="left" id="txtHint2"> </div>
</td>
<td>
<div align="left" id="whse2"> </div>
</td>
<td width=100>
<div align="left" id="su2"> </div>
</td>
</tr>
<tr id="r3">
<td>
<input size=10 type=number id=sku3 name=sku3 value="1174" onchange="showUser(3, this.value)">
</td>
<td>
<div align="left" id="txtHint3"> </div>
</td>
<td>
<div align="left" id="whse3"> </div>
</td>
<td width=100>
<div align="left" id="su3"> </div>
</td>
</tr>
<tr id="r4">
<td>
<input size=10 type=number id=sku4 name=sku4 value="1046" onchange="showUser(4, this.value)">
</td>
<td>
<div align="left" id="txtHint4"> </div>
</td>
<td>
<div align="left" id="whse4"> </div>
</td>
<td width=100>
<div align="left" id="su4"> </div>
</td>
</tr>
</table>
</form>
So as mentioned, the script works perfectly for the onchange event. I have defined values for each input box, when the page loads I want the script to be called and executed for those values. Once the user changes the values it must rerun for the new value.
I tried putting the following script in the header section of the page, but it is inconsistent in the rows it works for. My skills arent great so I feel I am missing something small.
<script type="text/javascript">
window.onload = function() {
showUser(1, document.getElementById("sku1").value);
showUser(2, document.getElementById("sku2").value);
showUser(3, document.getElementById("sku3").value);
showUser(4, document.getElementById("sku4").value);
}
</script>
Any advice is appreciated as always.
Thanks and Regards,
Ryan
Long shot, try this in your existing code. Declare xmlhttp as a local variable to the function.