Awesome, works perfectly, many thanks :)
I've updated the id to pPaper{paper_project_id}Su
Thanks for the fast response!
Main Topics
Browse All TopicsI'm currently developing a web application for scientific paper database management system, and am having issues with an AJAX function that is supposed to update multiple divs with the same name.
Schema background in simple terms is as follows:
There are multiple [papers] inside a [project] - call these [project_papers]. There are also 0 to many [subprojects] within the [project]. In the case of the screenshot example below there are 2 subprojects. A [project_paper] can exist in multiple [subprojects] within the project, or in none at all. Each row representing a [project_paper] on the screen has a "pin", which kind of acts like a sticky row when the contents of the project are contracted (hiding the ones with the pin off). The pin is a span with an id and name of "pPaper{project_paper_id}"
However, and this is where the problem exists, if the [project_paper] exists in two [subprojects] simultaneously, the span will of course have the same id and name as there is no differentiation between subprojects. Personally, I think this should be correct, and any javascript designed to update the contents of the span should apply to all instances on the page, but it only updates the top one - the database side of the AJAX fires correctly, and therefore the [project_paper] has the pin flag changed, but the display ends up confusingly incorrect.
Is there any way to update the javascript to update the content of both spans?
Screenshot example (rows in yellow are the one with the same id -- pin is red thing on the left):
http://rdms.powerwatch.org
Screenshot example with changed pin (top row pin changed but not bottom row):
http://rdms.powerwatch.org
HTML that calls the javascript function:
----------
<span name="pPaper<%=CLng(RS("pr
=CLng(RS("project_paper_id
=projPaperPin%>.gif" border="0" onClick="setProjectPin(<%
=CLng(RS("project_paper_id
-----------
Javascript functions:
-----------
/* Adjusts the pin status of a project paper within project or subproject for the active user */
var projPapPin;
function setProjectPin(projectPaper
{
projPapPin = projectPaperID;
xmlHttp=GetXmlHttpObject()
url="/includes/ajax/ch_pro
xmlHttp.onreadystatechange
xmlHttp.open("GET",url,tru
xmlHttp.send(null);
}
function displayProjectPin()
{
if (xmlHttp.readyState==4 || xmlHttp.readyState=="compl
{
document.getElementById('p
}
}
-----------
This Question has been solved and asker verified All Experts Exchange premium technology solutions are available to subscription members.
Experts Exchange has been collecting answers to technology questions since 1996…3 million and counting! If you have a question, chances are we already have your answer.
If you can't find the exact answer you're looking for, ask our exclusive community of 50,000 experts. You’ll get a personalized answer from a trusted professional.
Thousands of free tech tips, tricks, how-to’s and tutorials are available in our peer reviewed articles section. See for yourself how smart our experts are, no login required.
Access the answers to your technology questions today.
30-day free trial. Register in 60 seconds.
Members of the expert community talk about why the experience at Experts Exchange is different than what you will find anywhere else.

Try it out and discover for yourself.
30-day free trial. Register in 60 seconds.
Join the community of experts here and help other tech pros by answering question in your area of expertise. You can earn FREE access to all Experts Exchange's premium features and resources.
Business Accounts
Answer for Membership
by: nschaferPosted on 2007-11-14 at 06:50:25ID: 20280293
Your problem is that Element ID's should be unique and Javascript assumes that they are. So when you use getElementById() you are only getting the first element with that ID. You may want to try using getElementsByName. This will return a collection of elements with the name and you can then loop through them updating the innerHTML.
---------- ---------- ---------- ---- ete") ('pPaper'+ projPapPin );
---------- ---------- ---------- ----
I hope this helps,
Neal.
example:
--------------------------
function displayProjectPin()
{
if (xmlHttp.readyState==4 || xmlHttp.readyState=="compl
{
var el = document.getElementsByName
for (i=0;i<el.length;i++)
{
el[i].innerHTML = xmlHttp.responseText;
}
}
}
--------------------------