Hello, I am trying to save a dynamically created anchor’s id onclick, but I am having a lot of trouble.
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<style>
</style>
</head>
<body onload="initAll();">
<div id="test"></div>
<script type="text/javascript">
var xhr = false; //global xhr variable
var allRequestIds = new Array();
var allRequestDates = new Array();
var allRequestNames = new Array();
var allRequestBriefs = new Array();
var allListLinks = new Array();
var allListItems = new Array();
var linkId; //global variable for clicked link's id; set to be the same as xml data's id; used to pull more data in next page
function initAll(){
if (window.XMLHttpRequest){ //initialize xmlhttprequest into xhr variable
xhr = new XMLHttpRequest();
}
else{}//ie stuff goes here
xhr.open("GET","xml/request.xml",true); //open connection
xhr.onreadystatechange=createLinks; //onreadystatechange call createLinks()
xhr.send(null);
}
function createLinks(){
if(xhr.readyState==4){
if(xhr.status==200){
if(xhr.responseXML){
var allRequests=xhr.responseXML.getElementsByTagName("request"); //save all requests into array
var newList=document.createElement("ol"); //create a new ordered list
for(i=0;i<allRequests.length;i++){ //arrays of each tag, and an array of links
allRequestIds[i]=allRequests[i].getElementsByTagName("requestId")[0].firstChild.nodeValue;
allRequestDates[i]=allRequests[i].getElementsByTagName("date")[0].firstChild.nodeValue;
allRequestNames[i]=allRequests[i].getElementsByTagName("name")[0].firstChild.nodeValue;
allRequestBriefs[i]=allRequests[i].getElementsByTagName("brief")[0].firstChild.nodeValue;
allListLinks[i]=document.createElement("a"); //create an array of links
allListLinks[i].appendChild(document.createTextNode(""+allRequestDates[i]+" "+allRequestNames[i]+" "+allRequestBriefs[i]+"")); //i don't know how to add a new line within createtextnode!!! wtf?! i wanted to add a <br />
allListLinks[i].setAttribute("href","somepage.html");
allListLinks[i].setAttribute("class","dynamicLink");
allListLinks[i].setAttribute("onclick","pullDetailed();");
allListItems[i]=document.createElement("li"); //create an array of list items
allListItems[i].appendChild(allListLinks[i]); //append each anchor into each list item
newList.appendChild(allListItems[i]); //append all list items into ordered list
}
document.getElementById("test").appendChild(newList); //append list into test paragraph
}
}
}
}
function pullDetailed(){
alert("function pullDetailed called!"); //this is just testing to see if this function has been called on anchor click
linkId=this.innerHTML.; //this doesn't work
alert(linkId);
}
</script>
</body>
</html>
does anybody have an ideas? thank you.