seanlixu
commented
6 months ago <!DOCTYPE` html>
<html>
<style>
table,th,td {
border : 1px solid black;
border-collapse: collapse;
}
th,td {
padding: 5px;
}
</style>
<body>
<h1>The XMLHttpRequest Object</h1>
<button type="button" onclick="loadDoc()">Get my CD collection</button>
<br><br>
<table id="demo"></table>
<script>
function loadDoc() {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
myFunction(this);
}
};
xhttp.open("GET", "cd_catalog.xml", true);
xhttp.send();
}
function myFunction(xml) {
var i;
var xmlDoc = xml.responseXML;
var table="<tr><th>Artist</th><th>Title</th></tr>";
var x = xmlDoc.getElementsByTagName("CD");
for (i = 0; i <x.length; i++) {
table += "<tr><td>" +
x[i].getElementsByTagName("ARTIST")[0].childNodes[0].nodeValue +
"</td><td>" +
x[i].getElementsByTagName("TITLE")[0].childNodes[0].nodeValue +
"</td></tr>";
}
document.getElementById("demo").innerHTML = table;
}
</script>
</body>
</html>
Above ive found something that performs a similar function to what's required of the "search" page, where ajax will request for data from the response, and present the data in some format thats readable (in this case a table). im thinking of replacing the table with divs, and adding abit of css to make them cards.
Only issue here is how to get the db information in the format of json.
In terms of rendering the lastest jobs to the content section of the window, im unsure as to what technologies should be used exactly...
My current idea is to have users send another job to a separate db using the html form feature when they're on the "uplodaded jobs page", where there would be a "new job" button.
On the other hand is the "search" page where the jobs should be listed or displayed in their own little cards. to achieve this, I think we'd need Ajax to request the data from the separate db mentioned above, then use DOM and js to update the page. this would save the user from having to reload page.
Im unsure as to how Ajax could query the db, does anyone have any ideas? And what do you think of the plan? Is there anything else im missing?