Dynamically generate xml information with jquery onclick event

saleswreck

New Member
I'm creating a music player and I'm almost finished except for a few little issues. The main thing that I am trying to overcome is getting the information from an xml file to populate when I click on a jquery click function. I have a list of genres that are on the page which I need to click and have all the songs in that genre populate. Then those song names that populate need to be clickable to send to the player.My current code does two different things (I was just trying to get something to work). The first method unfortunately only pulls the first song name from the xml node but then just produces it on the page 7 times instead of producing the seven songs that are on that list.The second method gets all of the track names but then produces all 7 songs a couple of times on the page instead of just once. Then when I click on one of the songs to send it to the "Now Playing" section, it puts all 7 song names in the "Now Playing" section instead of just the one that I clicked on.I've tried pulling straight from the db and am still having the same problem which means its a problem with my javascript. Any help is much appreciated.Thanks!\[code\]<script> $(document).ready(function(){ $('a.genre8').click(function() { $.ajax({ type: "GET", url: "xml_filename.xml", dataType: "xml", success: function(xml) { $(xml).find('genre_rock').each(function(){ var name_text = $(this).find('trackName').text() $('<div>') .html(name_text) .appendTo('.song_playlist'); }); //close each( } }); //close $.ajax( }); //close click( }); //close $( <?php$xmlDoc = new DOMDocument();$xmlDoc->load("xml_filename.xml");$searchNode = $xmlDoc->getElementsByTagName( "genre_rock" ); $i = 0;foreach( $searchNode as $searchNode ) { $xmlDate = $searchNode->getElementsByTagName( "trackName" ); $valueTrack = $xmlDate->item(0)->nodeValue; ++$i; echo "$('a.genre" .$i . "').click(function(){ $('.song_playlist').html(\"" . "$valueTrack" ."\");" . "});"; } ?> })</script>\[/code\]Also, here is the output in the browser (You can see the seven track names I am trying to associate with this genre):\[code\] $(function() { $('a.genre8').click(function() { $.ajax({ type: "GET", url: "http://localhost/MetroSonic-music-player/xml_lib/genre_rock.php", dataType: "xml", success: function(xml) { $(xml).find('genre_rock').each(function(){ var name_text = $(this).find('trackName').text() $('<div>') .html(name_text) .appendTo('.player-handwriting-title'); }); //close each( } }); //close $.ajax( }); //close click( }); //close $( $('a.genre1').click(function(){ $('.player-handwriting-title').html("Whippin Post");});$('a.genre2').click(function(){ $('.player-handwriting-title').html("Sweet Caroline");});$('a.genre3').click(function(){ $('.player-handwriting-title').html("Tears in Heaven");});$('a.genre4').click(function(){ $('.player-handwriting-title').html("Ain't She Sweet");});$('a.genre5').click(function(){ $('.player-handwriting-title').html("Octopus' Garden");});$('a.genre6').click(function(){ $('.player-handwriting-title').html("Teen Spirit");});$('a.genre7').click(function(){ $('.player-handwriting-title').html("Knockin on Heaven's Door");});\[/code\]
 
Back
Top