Combining jQuery accordion with xml loop
in Using jQuery UI
•
6 years ago
I'm trying to put an xml loop in a jQuery UI accordion, but it's only the first loop that gets displayed in the accordion, the rest of the loops goes outside for some reason.
How can I make it work with each loop?
This is the accordion script (I've taken out the xml url and foreach stuff for simplicity)
- $(function() {
- $( "#accordion" ).accordion({
- heightStyle: "content",
- collapsible: true,
- active: false,
- activate: function( event, ui ) {
- if(!$.isEmptyObject(ui.newHeader.offset())) {
- $('html:not(:animated), body:not(:animated)').animate({ scrollTop: ui.newHeader.offset().top }, 'slow');
- }
- }
- });
- });
And this is what is supposed to be looped
- $x = 0;
- while($x <= 20) {
- <div id='accordion'>
- <div class='accord-header'>
- <div class='titellinie'>$stilling - $firma</div>
- </div>
- <div class='accord-content'>
- <div class='main-wrap'>
- <div class='banner'><img src='$banner'></div>
- <div class='main-content'>$stilling<br>$stillingsbeskrivelse</div>
- </div>
- <div class='sidebar-wrap'>
- <div class='sidebar-content'><img src='$kundelogo'>$intro</div>
- </div>
- </div>
- </div>";
- $x++;
- }
I've used a different type of jQuery accordion, which looped perfectly, but I was unable to make it scroll like i wanted to, when the accordion opened up, hence the switch to jQuery UI.
The first accordion, which works, is set up the same way as my non-working accordion, which is baffling me a bit.
Working accordion, can be seen here http://kreuzwerk.dk/dev/hrmanxmlacc/
Non-working accordion is here: http://kreuzwerk.dk/dev/hr-manager-xml-acc-alt/
1