•
•
•
•
What is DaniWeb IT Discussion Community?
You're currently browsing the JavaScript / DHTML / AJAX section within the Web Development category of DaniWeb, a massive community of 427,205 software developers, web developers, Internet marketers, and tech gurus who are all enthusiastic about making contacts, networking, and learning from each other. In fact, there are 2,165 IT professionals currently interacting right now! Registration is free, only takes a minute and lets you enjoy all of the interactive features of the site.
Please support our JavaScript / DHTML / AJAX advertiser: Lunarpages Web Hosting
Views: 2743 | Replies: 6
 |
•
•
Join Date: Apr 2008
Posts: 3
Reputation: 
Rep Power: 0
Solved Threads: 0
Newbie Poster
Hi,
I have list of items on a PHP page, and a <div> for each which i wish to populate with an AJAX request. Each <div> has a unique ID.
The code that i am using falls over due to the apparent static nature of this line:
If getElementById is set to "full-details" then the only <div> that is populated on the PHP page is the first one. If i click on a link lower down the list of items, the data changes correctly, but is populated only in the first <div>.
Is there a way of passing a variable to the line above?
showDetails is the function called by a link which contains the value for "str".
This is the full script:
I've tried:
getElementById(str)
getElementById(showDetails(str))
amongst a host of other hopeless stabs in the dark!!
Eternally grateful for any pointers, even if it's to say that i can't do it!
FTP.
I have list of items on a PHP page, and a <div> for each which i wish to populate with an AJAX request. Each <div> has a unique ID.
The code that i am using falls over due to the apparent static nature of this line:
document.getElementById("full-details").innerHTML=xmlHttp.responseText If getElementById is set to "full-details" then the only <div> that is populated on the PHP page is the first one. If i click on a link lower down the list of items, the data changes correctly, but is populated only in the first <div>.
Is there a way of passing a variable to the line above?
showDetails is the function called by a link which contains the value for "str".
This is the full script:
var xmlHttp
function showDetails(str)
{
xmlHttp=GetXmlHttpObject()
if (xmlHttp==null)
{
alert ("Browser does not support HTTP Request")
return
}
var url="../includes/full-details.inc.php"
url=url+"?q="+str
url=url+"&sid="+Math.random()
xmlHttp.onreadystatechange=stateChanged
xmlHttp.open("POST",url,true)
xmlHttp.send(null)
}
function stateChanged()
{
if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
{
document.getElementById("full-details").innerHTML=xmlHttp.responseText
}
}
function GetXmlHttpObject()
{
var xmlHttp=null;
try
{
// Firefox, Opera 8.0+, Safari
xmlHttp=new XMLHttpRequest();
}
catch (e)
{
//Internet Explorer
try
{
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e)
{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
}
return xmlHttp;
}I've tried:
getElementById(str)
getElementById(showDetails(str))
amongst a host of other hopeless stabs in the dark!!
Eternally grateful for any pointers, even if it's to say that i can't do it!
FTP.
•
•
Join Date: Apr 2008
Posts: 8
Reputation:
Rep Power: 0
Solved Threads: 0
Newbie Poster
I hope.. ur using static div's for response text... right!!!
Make some relations for those ids...
like..
div_content_details_1,
div_content_details_2
div_content_details_3.. and etc.,
if u might know that ur using three divs
then declare one global javascript variable
assign value like
/**/
/**/
Sorry if anything wrong... bcoz i might not know wt ur thinking
Thanks,
VinothKumar.C
<snipped>
Make some relations for those ids...
like..
div_content_details_1,
div_content_details_2
div_content_details_3.. and etc.,
if u might know that ur using three divs
then declare one global javascript variable
assign value like
/**/
JavaScript Syntax (Toggle Plain Text)
Sorry if anything wrong... bcoz i might not know wt ur thinking
Thanks,
VinothKumar.C
<snipped>
Last edited by peter_budo : Apr 26th, 2008 at 2:33 pm. Reason: 1)Please use [code] tags. 2) Please do not use "leet" speak or "chatroom" speak. 3) No emails or phone numbers in posts!
•
•
Join Date: Mar 2008
Location: Madrid - Spain
Posts: 20
Reputation:
Rep Power: 1
Solved Threads: 3
Newbie Poster
You may try to replace your line
with a line like:
document.getElementById("full-details").innerHTML=xmlHttp.responseText eval("document.getElementById('"+full-details+"').innerHTML=xmlHttp.responseText"); You keep going, have a Nice day!
Henry.
Before printing this message, make sure is necessary.
Henry.
Before printing this message, make sure is necessary.
•
•
Join Date: Apr 2008
Posts: 3
Reputation:
Rep Power: 0
Solved Threads: 0
Newbie Poster
•
•
•
•
Originally Posted by vinothkumarc 
I hope.. ur using static div's for response text... right!!!
Make some relations for those ids...
like..
div_content_details_1,
div_content_details_2
div_content_details_3.. and etc.,
if u might know that ur using three divs
then declare one global javascript variable
assign value like
/**/
/**/JavaScript Syntax (Toggle Plain Text)
Sorry if anything wrong... bcoz i might not know wt ur thinking
Thanks,
VinothKumar.C
<snipped>
I'm not using using static div's for my response text.....i want each div to have a unique ID. Is this breaking some golden rule?!
Each time the list script is run by whatever user, the list might contain 1 item or 50 items, or more, so i can't use the "control" suggestion.
The nub of the problem is getting a variable to be passed to the statusChanged function....which i can't manage at the moment.
Thanks,
FTP.
•
•
Join Date: Apr 2008
Posts: 3
Reputation:
Rep Power: 0
Solved Threads: 0
Newbie Poster
•
•
•
•
Originally Posted by HenryGR
You may try to replace your line
with a line like:document.getElementById("full-details").innerHTML=xmlHttp.responseText
eval("document.getElementById('"+full-details+"').innerHTML=xmlHttp.responseText");
I don't think this will work, as i don't know what the div name is to be!
I've called the div name by a unique ID, so there could be, for example, a list of three div's called 1234, 2345 & 3456. What i'm trying to do is pass that number into the getElementById function so that the correct corresponding div can be populated, when the data is returned.
FTP.
•
•
Join Date: Jan 2007
Posts: 2,556
Reputation:
Rep Power: 7
Solved Threads: 115
You can't use getElementById to access elements added by a script. It can see only the original ID list present at the time the page loads.
Daylight-saving time uses more gasoline
•
•
Join Date: Jun 2006
Location: India
Posts: 6,863
Reputation: 
Rep Power: 23
Solved Threads: 344
> You can't use getElementById to access elements added by a script.
Bosh. Please verify the facts before stating something.
> amongst a host of other hopeless stabs in the dark!!
> Eternally grateful for any pointers, even if it's to say that i can't do it!
You can try using Closures which are inner functions which can be executed even outside the context of it's enclosing function. Something like:
Bosh. Please verify the facts before stating something.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv"Script-Content-Type" content="text/javascript">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="Expires" content="0"> <!-- disable caching -->
<title>Example</title>
<script type="text/javascript">
function addElem(frm) {
if(!frm)
return;
var d = document.createElement("DIV");
d.id = "thirdDiv";
d.innerHTML = "ThirdDiv";
frm.appendChild(d);
}
function showDiv(frm) {
if(!frm)
return;
var divs = document.getElementsByTagName("DIV");
if(!divs)
return;
for(var i = 0, maxI = divs.length; i < maxI; ++i) {
alert("DIV-" + (i + 1) + ": " + divs[i].id);
}
}
function showNewDiv(frm) {
if(!frm)
return;
var e = document.getElementById("thirdDiv");
if(e) {
alert("The ID of newly added DIV is: " + e.id);
} else {
alert("First click on the 'Add DIV' button");
}
}
</script>
</head>
<body>
<form id="frm" name="frm" action="#">
<div id="firstDiv">FirstDiv</div>
<br>
<div id="secondDiv">SecondDiv</div>
<br>
<input type="button" value="Add DIV" onclick="addElem(this.form);">
<br><br>
<input type="button" value="Show all DIV's" onclick="showDiv(this.form);">
<br><br>
<input type="button" value="Show new DIV" onclick="showNewDiv(this.form);">
<br>
</form>
</body>
</html>> amongst a host of other hopeless stabs in the dark!!
> Eternally grateful for any pointers, even if it's to say that i can't do it!
You can try using Closures which are inner functions which can be executed even outside the context of it's enclosing function. Something like:
// Here 'id' is the ID of the element passed to the showDetails function
xmlHttp.onreadystatechange = function(myId) {
return function() {
if(xmlHttp.readyState == 4 || xmlHttp.readyState == "complete") {
document.getElementById(myId).innerHTML=xmlHttp.responseText;
}
}
}(id); I don't accept change. I don't deserve to live.
Happiness corrupts people.
Failing to value the lives of others cheapens your own.
Happiness corrupts people.
Failing to value the lives of others cheapens your own.
|
•
•
•
•
•
•
•
•
DaniWeb JavaScript / DHTML / AJAX Marketplace
•
•
•
•
Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
Linear Mode
Similar Threads
- Dynamic Div Height (JavaScript / DHTML / AJAX)
- positioning a dynamic div to cover an existing table (HTML and CSS)
- Urgent.....Dynamic Changes.... (JavaScript / DHTML / AJAX)
Other Threads in the JavaScript / DHTML / AJAX Forum
- Previous Thread: Rotating image gallery - highlight border of current image displayed
- Next Thread: How to get the timespan a visitor stays on site before bouncing away?
