peuplement jQuery UI accordéon avec xml, problème de liaison

Question

Je remplis l'accordéon jQuery à partir du fichier xml simple, je peux obtenir mes données et l'ajouter en tant que html pour simuler le balisage accordéon. Puis j'appelle à l'accordéon, ça ne marchera pas!

Je suppose que le problème est de lier des données nouvellement créées à DOM, j'ai essayé .live() et .delegate sans succès.

Comment dois-je procéder?

est ici simplifié exemple de mon code (désolé que certains des noms et des commentaires sont en :-) finnish) voici le lien http://www.equstom.fi/hanuri.html

$('#valitsija').click(function() { 
$.get('http://www.equstom.fi/kurssit.xml', function(data) { 
    $('#accordion').empty(); 
    $(data).find('Kurssi').each(function() { 
    var $kurssi = $(this); 
    var html = '<div>'; 
    html += '<h3><a href="#">' + $kurssi.find('KurssinNimi').text() + '</a></h3>'; 
    html += '<div>' + $kurssi.find('KurssiKuvaus').text() + '</div>'; 
    html += '</div>'; 
    $('#accordion').append($(html)); 
    }); 
}); 
}); 

/* * ** * ** * ** * haetaankurssit loppu * ** * ** ** * ***/ // Accordéon $ ("# accordéon") accordéon. ({Header: "h3"});

http://www.equstom.fi/hanuri.html 

Answer 1

Notez les deux lignes ci-dessous j'ai ajouté (avec des commentaires). Vous devez détruire et ensuite recréer l'accordéon. Je suggère de stocker le #accordion dans une variable de sorte que vous ne devez pas continuer à chercher pour cela. C'est ce qu'on appelle la mise en cache. (Je sais que ce n'est pas votre question, mais je me suis dit que je proposerais cette suggestion de toute façon). Quelque chose comme ceci:

$('#valitsija').click(function() { 
    $.get('http://www.equstom.fi/kurssit.xml', function(data) { 

     var acc = $('#accordion'); 
     //you need to destroy the accordion first 
     acc.accordion("destroy"); 
     acc.empty(); 

     $(data).find('Kurssi').each(function() { 

      var $kurssi = $(this); 
      var html = '<div>'; 
      html += '<h3><a href="#">' + $kurssi.find('KurssinNimi').text() + '</a></h3>'; 
      html += '<div>' + $kurssi.find('KurssiKuvaus').text() + '</div>'; 
      html += '</div>'; 
      acc.append($(html)); 

     }); 

     //you need to re-make the accordion 
     acc.accordion({ header: "h3" }); 
    }); 
}); 

Proof that it works

Answer 2

j'ai écrit un XML utilitaire jQuery accordéon hier soir et je pensais que je partagerais avec vous tous ici. Tout commentaire est apprécié.

http://lytsp33d.com/xml-to-jquery-accordion/

Meilleures salutations, Zach