I am trying to create a simple job listing, where users can click on a job title and a page would come up where the job description would be dynamically loaded. I started a thread in xml and someone suggested asking here. Thanks in advance!
Tek-Tips is the largest IT community on the Internet today!
Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!
-
Congratulations Mike Lewis on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!
Newb question regarding dynamic data pulled from xml 1
- Thread starter BenMiles
- Start date
dwarfthrower
Programmer
What have you tried so far that isn't working?
[sub]Never be afraid to share your dreams with the world.
There's nothing the world loves more than the taste of really sweet dreams.[/sub]
Webflo
[sub]Never be afraid to share your dreams with the world.
There's nothing the world loves more than the taste of really sweet dreams.[/sub]
Webflo
- Thread starter
- #3
here is my xml
and here is my javascript/html
I got it so it pulls all the job titles in for the first page, what I want is when a user clicks on a job title, a the same html page will open but the content will change depending on what job title the user clicks
Code:
<?xml version="1.0" encoding="ISO-8859-1" ?>
<CAREERS>
<JOB>
<TITLE>Director of Sales</TITLE>
<DESC>blah blah blah</DESC>
</JOB>
<JOB>
<TITLE>Graphic Designer</TITLE>
<DESC>blah blah blah</DESC>
</JOB>
<JOB>
<TITLE>Web Developer</TITLE>
<DESC>blah blah blah</DESC>
</JOB>
</CAREERS>
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "[URL unfurl="true"]http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">[/URL]
<html xmlns="[URL unfurl="true"]http://www.w3.org/1999/xhtml">[/URL]
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<body>
<script type="text/javascript">
var xmlDoc=null;
if (window.ActiveXObject)
{// code for IE
xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
}
else if (document.implementation.createDocument)
{// code for Mozilla, Firefox, Opera, etc.
xmlDoc=document.implementation.createDocument("","",null);
}
else
{
alert('Your browser cannot handle this script');
}
if (xmlDoc!=null)
{
xmlDoc.async=false;
xmlDoc.load("test.xml");
document.write("<table>");
var x=xmlDoc.getElementsByTagName("JOB");
for (i=0;i<x.length;i++)
{
document.write("<tr>");
document.write("<td>");
document.write("<a href = 'JobDesc.html'>");
document.write(
x[i].getElementsByTagName("TITLE")[0].childNodes[0].nodeValue);
document.write("</a>");
document.write("</td>");
}
document.write("</table>");
}
</script>
</body>
</html>I got it so it pulls all the job titles in for the first page, what I want is when a user clicks on a job title, a the same html page will open but the content will change depending on what job title the user clicks
This is something I've played around with before. You have all the data loaded in the xmlDoc so why not use it dynamically like this. I've added descriptions to the jobs
Here's the html/javascript
Code:
<?xml version="1.0" encoding="ISO-8859-1" ?>
<CAREERS>
<JOB>
<TITLE>Director of Sales</TITLE>
<DESC>Description for Director of Sales</DESC>
</JOB>
<JOB>
<TITLE>Graphic Designer</TITLE>
<DESC>Description for Graphic Designer</DESC>
</JOB>
<JOB>
<TITLE>Web Developer</TITLE>
<DESC>Description for Web Developer</DESC>
</JOB>
</CAREERS>Here's the html/javascript
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "[URL unfurl="true"]http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">[/URL]
<html xmlns="[URL unfurl="true"]http://www.w3.org/1999/xhtml">[/URL]
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style>
#jobs {
position:absolute;
top:100px;
left:100px;
border:thin solid black;
}
#descriptions {
position:absolute;
top:100px;
left:300px;
width:400px;
height:200px;
border:thin solid black;
padding:10px 10px 10px 10px;
}
a {
text-decoration:underline;
}
a:hover {
cursor:pointer;
}
</style>
<script type="text/javascript">
var jobs = new Array();
function setup() {
var xmlDoc=null;
if (window.ActiveXObject)
{// code for IE
xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
}
else if (document.implementation.createDocument)
{// code for Mozilla, Firefox, Opera, etc.
xmlDoc=document.implementation.createDocument("","",null);
}
else
{
alert('Your browser cannot handle this script');
}
if (xmlDoc!=null)
{
xmlDoc.async=false;
xmlDoc.load("tips.xml");
var jobTitle, jobDesc, tb, row, cell, lnk;
tb = document.getElementById("jobtable");
var jb=xmlDoc.getElementsByTagName("JOB");
for (i=0; i<jb.length; i++) {
jobTitle = jb[i].getElementsByTagName("TITLE")[0].childNodes[0].nodeValue;
jobDesc = jb[i].getElementsByTagName("DESC")[0].childNodes[0].nodeValue;
jobs[jobTitle] = jobDesc;
row = tb.insertRow(-1);
cell = row.insertCell(-1)
lnk = document.createElement("a");
lnk.onclick = showJobDescription;
lnk.innerHTML = jobTitle;
cell.appendChild(lnk);
}
}
}
function showJobDescription(ev) {
var src = ev ? ev.target: event.srcElement;
document.getElementById("descriptions").innerHTML = jobs[src.innerHTML];
}
</script>
</head>
<body onload="setup()">
<div id="jobs">
<table id="jobtable">
</table>
</div>
<div id="descriptions"></div>
</body>
</html>- Thread starter
- #5
Yea Clive posted that in the xml forum, I think it looks really good, but right now our site is set up that when a user clicks on a job title a new page is opened with the job desc (non dynamic) so we are trying to get away from having to make a new page everytime we add a page, so I am looking to do two pages, the second one will load the job desc dynamically
-
1
- #6
Stretchwickster
Programmer
I've now posted a solution which should satisfy your "new window" requirement in the XML forum:
thread426-1457995
Clive
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
"To err is human, but to really foul things up you need a computer." (Paul Ehrlich)
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
To get the best answers from this forum see: faq102-5096
thread426-1457995
Clive
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
"To err is human, but to really foul things up you need a computer." (Paul Ehrlich)
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
To get the best answers from this forum see: faq102-5096
- Thread starter
- #7
- Status
Similar threads