How to display next node from XML document on button event

Question

I am working through w3schools and am stuck on a bit of XML. The following page shows a parsed XML file which has a single node (with several children) displayed as HTML. I always challenge myself to push the code before me to encourage more meaningful learning, but this time I am stuck! Here is the link to the page:

http://www.w3schools.com/xml/tryit.asp?filename=tryxml_app_first

The XML file is a mock 'CD catalogue' that contains a list of CD nodes, containing child nodes of artist, title, etc. The page displays a single CD node, selected by the lines:

x=xmlDoc.getElementsByTagName("CD");  
i=0;

What I am trying to do is create a button which, when pressed, increases the value of "i" by 1. Essentially a 'next' button. I have tried to create a button/function combo while treating "i" as a variable. That fails, so I get the feeling that I don't actually understand how XML/DOM works...

I understand that this may be a trivial question but I have tried different search terms on Google and Stack Overflow but with no success. If there's a way to do what I'm trying to, please let me know!

Edit: Eek! I'm so stupid and was so engrossed in this little self-challenge that I didn't even read on to the next section of the page on w3schools, titled "Navigate Between the CDs":

http://www.w3schools.com/xml/xml_applications.asp

I will leave this question as is for people who Google for this, but if you look at w3school's example (click "Try it yourself", is it the most efficient way to do it?

It might be a good idea to note here that W3Schools isn't a very good place to start learning JavaScript. Placing large amount of code into inline event handlers are also frowned upon in real world situations. — Yi Jiang
– Yi Jiang, Commented Mar 13, 2011 at 19:31

amit_g · Accepted Answer · 2011-03-12 01:35:44Z

1

<button onclick="i++;displayCD();">Next</button>

EDIT: Take care of moving beyond the length and prev button

<button onclick="i++; if (i >= x.length) i = x.length - 1; displayCD()">Next</button>
<button onclick="i--; if (i < 0) i = 0; displayCD()">Prev</button>

edited Mar 12, 2011 at 1:35

answered Mar 12, 2011 at 1:26

amit_g

31.3k8 gold badges67 silver badges124 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

SarahGlass Over a year ago

Wow. You answered both my questions with magical grace. I love you :P I tried that line before but only once without the function call and once without the increment. I wouldn't have thought of having both.

SarahGlass Over a year ago

If anyone has enough reputation, please vote up this answer :)

SarahGlass Over a year ago

Oh it was part of the edit- whether there was a more efficient way to do it than on the w3schools example. Thanks for your edit too. That's pretty much what I was after- the barebones code necessary to work.

Collectives™ on Stack Overflow

How to display next node from XML document on button event

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related