javascript - Problem med AJAX request - Udvikleren.dk - Programmering, webdesign og grafik

Tags: javascript

Bruger #6559 @ 16.03.09 20:57

Hej alle,

jeg er i gang med et webgalleri, der benytter sig af jQuery til at lave AJAX requests. Nu har jeg så lavet et script, der gør at når man klikker på et album billede så hentes alle billeder fra det bestemte album. Der er bare det problem at click eventet ikke virker på de billeder, som er hentet ind ved hjælp af AJAX. Problemet kan ses på http://askjaer.frac.dk/db/

Hvis man klikker på det store billede, så kan man se at den forsøger at finde et album i databasen, men den gør det ikke ved dem der hente via AJAX kald

Nogen der har en ide til hvordan jeg løser dette?

Mvh Martin

6 svar postet i denne tråd vises herunder
1 indlæg har modtaget i alt 1 karma

Sorter efter stemmer Sorter efter dato

Bruger #10216 @ 16.03.09 21:25

4.283

Vælg en af følgende nedestående muligheder.

1. Vent på at kaldet er færdigt og tillæg nye click handlers på de nye billeder.

2. Prop noget onclick kode med på billederne du sender tilbage til browser.

3. Load billederne som en JSON formateret liste og generer den nødvendige html.

Bruger #6559 @ 16.03.09 21:27

843

Jeg er ny indenfor dette område, så hvad ville du anbefale eller mene ville være nemmest?

Jeg benytter $(document).ready() på hver function, men det er måske ikke smart?

Bruger #5789 @ 17.03.09 08:25

640

google: jquery ajax

Den har metoder til at hente xml asynkront, så skal du gennem dom bygge dit galleri.

/J

Bruger #6559 @ 17.03.09 18:09

843

Nu har jeg prøvet at sende det som XML over og prøvet at bygge det op ved hjælp af DOM, men det er ligesom den ikke gør det helt færdigt.

Mit script der henter XML'en ser ud som følgende:

JScript kode

 $(document).ready(function() {
             $.get("inc/gallery/controller.php", {page: "albumSelector"},
                 function(xml) {
                     $(xml).find("albumImage").each(function() {
                         var alt = $(this).find("alt").text();
                         var picture_id = $(this).attr("id");
                         
                         $("#selector").html("<img alt=\"" + alt + "\" height=\"90\" src=\"inc/gallery/getPicture.php?id=" + picture_id + "\" width=\"120\" />").appendTo("#albumSelector");                        
                     });
                 });
         });

Og min struktur i XML ser således ud

XML kode

 <result>
   <albumImage id="1">
     <alt>Test album</alt>
   </albumImage>
 </result>

Bruger #6559 @ 17.03.09 20:04

843

#Jokke: Nu har jeg fået den til at hente og parse XML data fra serveren og indsætte det ved hjælp af DOM, men den viser stadigvæk ingen tags.

Det her er hvad jeg er kommet frem til i AJAX delen

JScript kode

 $(document).ready(function() {
             $.get("inc/gallery/controller.php", {page: "albumSelector", page_id: 1},
                 function(xml) {
                     $("image", xml).each(function() {
                         alt = $(this).find("alt").text();
                         picture_id = $(this).attr("id");
 
                         content = "<img alt=\"" + alt + "\" height=\"90\" src=\"inc/gallery/controller.php?page=showPicture&id=" + picture_id + "\" width=\"120\" />";
                         $("#albumSelector").append(content);
                     });
                 });
         });

Kan du/I se hvad jeg evt har gjort forkert?

Bruger #6559 @ 18.03.09 16:15

843

Jeg har løst det selv. Jeg fandt ud af at et plugin til jQuery kunne løse problemet med at tilføje et event på et DOM element efter det var tilføjet.

Pluginet hedder livequery.

Problem med AJAX request

Karma barometer (30 dage)

Modtaget

Givet

Favorit hos
Forum tråde
Artikler