AJAX Jquery Challenge: Testez vos pourrait

  • mindfullsilence
  • Professor
  • Professor
  • Avatar de l’utilisateur
  • Inscription: Aoû 04, 2008
  • Messages: 846
  • Status: Offline

Message Octobre 2nd, 2010, 5:13 pm

Donc, Ive a obtenu une structure de fichiers xml comme ceci:

XML Code: [ Select ]
<category name="wedding">
<subcategory name="Desmond">
<link thumb="path/to/thumb.jpg"></link>
</subcategory>
</category>
 
  1. <category name="wedding">
  2. <subcategory name="Desmond">
  3. <link thumb="path/to/thumb.jpg"></link>
  4. </subcategory>
  5. </category>
  6.  


Ceci est une version abrégée. La version complète sera dynamique de population des balises XML. Il y aura seulement une catégorie de mariage. Il y aura les sous-catégories multiples. Et il y aura des liens multiples au sein de chaque sous-catégorie.

Im en mesure de tirer dans le fichier xml avec l'appel ajax jquery.
J'ai aussi un fichier HTML structuré comme suit:

[HTML]
id="sidebar"> <div

</ Div>
[/ Html]

Assez simple.

Je veux remplir la div barre latérale avec une liste de liens associés aux noeuds XML ci-dessus. Donc, le résultat HTML devrait ressembler à ceci après l'appel Ajax:

HTML Code: [ Select ]
<div id="sidebar">
 
<h2>Weddings</h2>
 
<ul>
<li><h3>Desmond</h3></li>
<li><img src="path/to/thumb.jpg" /></li>
</ul>
 
  1. <div id="sidebar">
  2.  
  3. <h2>Weddings</h2>
  4.  
  5. <ul>
  6. <li><h3>Desmond</h3></li>
  7. <li><img src="path/to/thumb.jpg" /></li>
  8. </ul>
  9.  


Lorsque, pour chaque sous-catégorie, il ya une nouvelle liste non ordonnée créé dont le premier élément de liste est un niveau 3 en-tête contenant le texte de l'attribut xml nom de la «sous-catégorie" le ganglion. À la suite de cet article la liste, chaque nœud enfant de cette sous-catégorie ("link") est remplie comme un élément de la liste.

Ive a essayé pendant environ une semaine maintenant que cela se fasse, mais je finis par se perdre dans la traversée de l'XML à chaque fois. Tout de vous les gars en mesure de le retirer?
Use your words like arrows to shoot toward your goal.
  • Anonymous
  • Bot
  • No Avatar
  • Inscription: 25 Feb 2008
  • Messages: ?
  • Loc: Ozzuland
  • Status: Online

Message Octobre 2nd, 2010, 5:13 pm

  • Bogey
  • Bogey
  • Genius
  • Avatar de l’utilisateur
  • Inscription: Juil 14, 2005
  • Messages: 8211
  • Loc: USA
  • Status: Offline

Message Octobre 2nd, 2010, 8:33 pm

Serait facile avec php, mais je n'ai pas le droit de travail PC maintenant (à l'aide d'un iPhone), donc je ne peux pas vous aider pour le moment.

Tout ce détachement se demander pourquoi Ajax? Est-il besoin d'être Ajax?
"Bring forth therefore fruits meet for repentance:" Matthew 3:8
  • mindfullsilence
  • Professor
  • Professor
  • Avatar de l’utilisateur
  • Inscription: Aoû 04, 2008
  • Messages: 846
  • Status: Offline

Message Octobre 3rd, 2010, 12:00 pm

La raison pour laquelle je voulais que ce soit ajax c'est parce que je ne voulez pas charger certaines parties du fichier xml sur certains événements. J'ai une barre de navigation avec chaque grande catégorie de lien. Alors, quand une personne clique sur "Mariages" dans la barre de navigation, la barre latérale est div vidé de son contenu et le "Mariage" catégorie est laoded chargé dans la barre latérale. Toutefois, si cela peut être fait avec PHP dans un plus facile que la mode ajax, n'hésitez pas à partager. Le fichier xml sera écrit en PHP et que je pourrais aussi bien faire tous les travaux lourds avec PHP.

Id-dire si son php, que chaque grande catégorie a besoin de produire une page séparée que je peux charger dans mon div sidebar lorsque l'utilisateur clique.

Vous voyez, il existe plusieurs grandes catégories:
Mariages, Portraits, Beaux-Arts, Photojournalisme, Nature, Creative, et d'impression.

Il y aura seulement un noeud xml pour chacune de ces catégories. Cependant, chacune de ces catégories tiendra plusieurs sous-catégories qui seront générés par un écrit cms Im.
Use your words like arrows to shoot toward your goal.
  • mindfullsilence
  • Professor
  • Professor
  • Avatar de l’utilisateur
  • Inscription: Aoû 04, 2008
  • Messages: 846
  • Status: Offline

Message Octobre 5th, 2010, 8:19 pm

Bon, puisque personne ne semble relever le défi, voici la réponse. La raison pour laquelle il a été tellement confus pour moi, c'est parce qu'il semble que beaucoup de fonctions au sein de fonctions. Ici, il est:

JAVASCRIPT Code: [ Select ]
$.ajax({
   
    url: "js/cats.xml",
   type: 'GET',
   dataType: 'xml',
   timeout: 1000,
   error: function(){
      alert('not loaded');
   },//end error
    success: function(xml) {
 
$(xml).find('category[name="weddings"]').each( function() {
var sidebar = $('#sidebar')
 
sidebar.slideUp(300, function() {
$(this).empty();
$(xml).find('category[name="weddings"]').children('subcategory').each( function() {
sidebar.append('<ul class="cat"><li><h3>' + $(this).attr('name') + '</h3></li></ul>');
$(this).children('link').each( function() {
sidebar.children('ul').last().append('<li><a rel="' + $(this).attr('href') + '"><img src="' + $(this).text()  + '" /></a></li>');
});
});
});
});
}
});
 
  1. $.ajax({
  2.    
  3.     url: "js/cats.xml",
  4.    type: 'GET',
  5.    dataType: 'xml',
  6.    timeout: 1000,
  7.    error: function(){
  8.       alert('not loaded');
  9.    },//end error
  10.     success: function(xml) {
  11.  
  12. $(xml).find('category[name="weddings"]').each( function() {
  13. var sidebar = $('#sidebar')
  14.  
  15. sidebar.slideUp(300, function() {
  16. $(this).empty();
  17. $(xml).find('category[name="weddings"]').children('subcategory').each( function() {
  18. sidebar.append('<ul class="cat"><li><h3>' + $(this).attr('name') + '</h3></li></ul>');
  19. $(this).children('link').each( function() {
  20. sidebar.children('ul').last().append('<li><a rel="' + $(this).attr('href') + '"><img src="' + $(this).text()  + '" /></a></li>');
  21. });
  22. });
  23. });
  24. });
  25. }
  26. });
  27.  
Use your words like arrows to shoot toward your goal.

Afficher de l'information

  • Total des messages de ce sujet: 4 messages
  • Utilisateurs parcourant ce forum: Aucun utilisateur enregistré et 123 invités
  • Vous ne pouvez pas poster de nouveaux sujets
  • Vous ne pouvez pas répondre aux sujets
  • Vous ne pouvez pas éditer vos messages
  • Vous ne pouvez pas supprimer vos messages
  • Vous ne pouvez pas joindre des fichiers
 
 

© 2011 Unmelted, LLC. Ozzu® est une marque déposée de Unmelted, LLC