so I am working on a website that uses AJAX to connect to the Php page shown below. The php connects to a database and does queries based on if conditions. Then it echos back to the html as a table. What I am trying to do now is to access the input tag (myCheckBox) and corresponding price and item description. The item description and price are returned from the database. The name of the two are $row['ItemDescription] and $row[Price]. The input tags are given an id (myCheckBox). How can I reference these elements back in my html. I can live with just the item description and price but the input tags would be nice to have too. The html is shown below the Php.
<head>
<style>
table {width: 100%;border-collapse: collapse;}
table, td, th {border: 1px solid black;padding: 5px;}
th {text-align: left;}
</style>
</head>
<body>
<?php
$q =$_GET['q'];
$con = mysqli_connect("connection","uName","pass", "dbName");
if (!$con) {
die('Could not connect: ' . mysqli_error($con));
}
mysqli_select_db($con,"ajax_demo");
if($q == 's'){$sql="SELECT * FROM Goods WHERE Category = 'Sporting Goods'";}
if($q == 'e'){$sql="SELECT * FROM Goods WHERE Category = 'Entertainment'";}
if($q == 'c'){$sql="SELECT * FROM Goods WHERE Category = 'Clothes'";}
$result = mysqli_query($con,$sql);
echo "<table id='myTable'>
<tr>
<th>Item Description</th>
<th>Price</th>
</tr>";
while($row = mysqli_fetch_array($result)) {
echo "<td><input id='myCheckBox' type='checkbox'>" . $row['ItemDescription'] . "</td>";
echo "<td>" . $row['Price'] . "</td>";
echo "</tr>";
}
echo "</table>";
mysqli_close($con);
?>
</body>
</html>
Here is the html.
function showUser(str, myInt) {
if (str == "bob") {
document.getElementById("myDiv2").innerHTML = "";
return;
} else {
if (window.XMLHttpRequest) {
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
} else {
// code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("myDiv2").innerHTML = this.responseText;
alert(this.responseText);
}
};
if(myInt == 1){xmlhttp.open("GET","getuser.php?q="+str,true);}
if(myInt == 2){xmlhttp.open("GET","shop.php?q="+str,true);}
if(myInt == 3){xmlhttp.open("GET","aInfo.php?q="+myVar3[0],true);}
xmlhttp.send();
}
}
Thanks to any helpful responses. Note the input tags are created in the while loop. This helps with the formatting. I would like to be able to access each input tag and it's corresponding price and item description. Then I can reference these by array indexes.
so I was able to resolve the issue but I had to do some reformatting in my Php page. The objective was to access elements from the php page and be able to process them in other pages. The original page would work with the solution below but additional steps would be necessary.
function myFun(){myDivVar =document.getElementById("myDiv2").children;
varArrayNew=Array.prototype.
slice.c all(myDivVar);
alert(varArrayNew[1].innerHTML);alert(varArrayNew).length;
}
And the Php.....
<!DOCTYPE html>
<html>
<!--<input type='button' id='bob 'value='hello'> -->
<head>
<style>
table {width: 100%;border-collapse: collapse;}
table, td, th {border: 1px solid black;padding: 5px;}
th {text-align: left;}
</style>
</head>
<body>
<?php
$q =$_GET['q'];
$con = mysqli_connect("path","userNa","pass", "db");
if (!$con) {die('Could not connect: ' . mysqli_error($con)); }
mysqli_select_db($con,"ajax_demo");
if($q == 's'){$sql="SELECT * FROM Goods WHERE Category = 'Sporting Goods'";}
if($q == 'e'){$sql="SELECT * FROM Goods WHERE Category = 'Entertainment'";}
if($q == 'c'){$sql="SELECT * FROM Goods WHERE Category = 'Clothes'";}
$result = mysqli_query($con,$sql);
while($row = mysqli_fetch_array($result)) {
echo "<p>". $row['ItemDescription'].":";
echo $row['Price']. ",<br></p>";
}
mysqli_close($con);
?>
</body>
</html>
Not it's just a matter of splitting the returned values in a for loop that iterates through the length of the response text array minus 1