Hi there,
Here is a very simple implementation of what you are talking about - it
assumes you have three divs in the markup with IDs 'place', 'house', and
'level', and that you load content for these from 'places.php', houses.php'
and 'levels.php' respectively. It also assumes that the PHP files simply
return HTML fragments (lists).
$(function(){
// load the first list when the document loads
$('#place').load('places.php',{},function(){
// 'this' holds a reference to the dom content loaded, so attach a
click handler to each list item
$('li', this).click(function(){
// when a list item is clicked, pass the text of the item to
houses.php, and load in #house
$('#house').load('houses.php',{'place':$(this).text()},function(){
// do the same thing with the loaded list
$('li', this).click(function(){
// do the same again when this level is clicked
$('#level').load('levels.php',{'house':$(this).text()},
function(){
// now you need logic to handle clicks on elements
in the #level list items
});
});
});
})
});
});
Although this is a working example / proof of concept, I'm sure there has to
be a more elegant way of doing it (with a plugin?)
Tony-182 wrote:
>
>
> Hello Everyone!
>
> I have 3 DIV's next to each other. I want that the first div is loaded
> over jquery with a php file which outputs an unordered list in html.
>
> When I click on a list item in the first DIV I want that jquery sends
> the parameters from the list to a second php file for making an
> unordered list which is loaded this time into the second DIV.
>
> The same should happen from the second DIV into the third DIV whith a
> third php file.
>
>
> All php files connect to a mysql database which has three tables
> (Place, House, Level). The tables have three columns(id, name,
> location). location is always linked to the next table's id (ex.
> "sesame street 1" has id 37 then tabel Place would have folowing
> entry: id=1 name=Stockholm location=37 )
>
> The purpose of this script is to navigate though houses in different
> places. The 3 DIV's contain following.
> DIV 1 = Place (ex. Stockholm, Berlin, Barcelona)
> DIV 2 = House (sesame street 1, sesame street 2, sesame street 3)
> DIV 3 = Level (Floor 1, Floor 2, Floor 3)
>
> I really tried all things in jquery from appendTo to $.ajax but I just
> dont get it working! The three divs are easy to create but getting the
> content dynamically into them seems quite impossible. Please help me,
> I tride really long to solve this problem but I just don't seem to get
> it, hope someone can help me :(
>
>
--
View this message in context:
http://www.nabble.com/generated-content%28PHP%29-into-DIV--tp23318863s27240p23325009.html
Sent from the jQuery General Discussion mailing list archive at Nabble.com.
