I have a page which loops down the first column and copies the value to a text box, and then it is supposed to query data.asp
, but I keep getting an error of either GET http://192.168.1.12/pb_search/v2/demo/data.asp?h_prodref=undefined 404 (Not Found)
or XHR finished loading: GET "http://192.168.1.12/pb_search/v2/demo/data.asp?h_prodref=undefined"
. Errors from Google Chrome Developer Tools.
Both my scripts work independently, but when I piece them together, I get these erorors. I am probably missing something really simple, but I very much learning this on the fly, so any help would be appreciated.
Full Code
<%@LANGUAGE="VBSCRIPT" CODEPAGE="65001"%>
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
</head>
<body>
<table width="50%" border="0" cellspacing="2" cellpadding="2">
<tr>
<td width="16%" class="prodref">84PS01</td>
<td width="51%"><input type="text" class="h_prodref" /><button type="button" onclick="loadDoc()">Change Content</button></td>
<td width="33%" id="demo"> </td>
</tr>
<tr>
<td class="prodref">92K002</td>
<td><input type="text" class="h_prodref" /><button type="button" onclick="loadDoc()">Change Content</button></td>
<td id="demo"> </td>
</tr>
<tr>
<td class="prodref">68F017</td>
<td><input type="text" class="h_prodref" /><button type="button" onclick="loadDoc()">Change Content</button></td>
<td id="demo"> </td>
</tr>
</table>
<script>
var prodref = document.getElementsByClassName("prodref");
var h_prodref = document.getElementsByClassName("h_prodref");
var i = 0;
for (i; i < prodref.length; i++) {
h_prodref[i].value = prodref[i].innerHTML;
function loadDoc() {
var x = document.getElementsByClassName("h_prodref");
x[i] = document.getElementsByClassName("h_prodref").value;
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (xhttp.readyState == 4 && xhttp.status == 200) {
document.getElementById("demo").innerHTML = xhttp.responseText;
}
}
xhttp.open("GET", "data.asp?h_prodref="+x[i].value, true);
xhttp.send();
}
}
</script>
The value undefined
is getting added into AJAX call that is made instead of the expected value of x[i].value
. I'm making an assumption here though and that is that
http://192.168.1.12/pb_search/v2/demo/data.asp
exists and the HTTP 404 Not Found
is being forced by the data.asp
script as a scripted response and not because the server can't find the data.asp
page.
When calling a function
you don't need the entire definition at the point where you want to call it, if this was the case you would have the same function being duplicated throughout the code where it is called breaking fundamental principles in programming like DRY.
Here is a quick example of restructuring the JavaScript code:
var prodref = document.getElementsByClassName("prodref");
var h_prodref = document.getElementsByClassName("h_prodref");
var i = 0;
for (i; i < prodref.length; i++) {
h_prodref[i].value = prodref[i].innerHTML;
// Call function inside the loop
loadDoc();
}
// Definition should be defined once
function loadDoc() {
var x = document.getElementsByClassName("h_prodref");
x[i] = document.getElementsByClassName("h_prodref").value;
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (xhttp.readyState == 4 && xhttp.status == 200) {
document.getElementById("demo").innerHTML = xhttp.responseText;
}
}
xhttp.open("GET", "data.asp?h_prodref="+x[i].value, true);
xhttp.send();
}
Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments