jQuery dilemma in loading different pages on one page

Hello i need some help to figure out what 开发者_JAVA技巧to do .

I am trying to create a page that has a list of events and each time I click one of the list's elements a different photo gallery should load. I did this by loading each gallery in a different iframe.

The problem is that right now the only thing it dose is loading the first galery and the other ones don't seem to manage loading any pictures (if I refresh each frame than they work fine)

What should i do?

This is the script I used in the webpage

You can find the page source here http://www.avantsolutions.ro/exp.txt

You can try with jQuery UI Plugin instead of iFrame. On clicking of list item(West pane), you can load center pane div with corresponding images. Check the examples here.

You can use jQuery's load function to load a gallery via ajax.

$(selectorForYourGalleryDisplayDiv).load( url, [ data ], [ complete(responseText, textStatus, XMLHttpRequest) ] )

Load will take the result from url, if you need to pass it data it will use a HTTP POST, and replace the inner html of the wrapped set it is called on.

I don't know the internals of your architecture, but the main process is giving your galleries Ids, pass them to the server using the JSON format, your code will use that id to get what's needed for the gallery, render the html and return it.

load will drop that html into the elements that match selectorForYourGalleryDisplayDiv.