[parthmody90]

Im printing out an unordered list dynamically...heres the code which does it

<?php 
include_once "connect_to_mysql.php";


$name = $_POST['name'];

$todo = $_POST['todo'];
 $sql = mysql_query("INSERT INTO todo (todo,name) 
     VALUES('$todo','$name')")  
     or die (mysql_error());
	 $sql2 = mysql_query("SELECT DISTINCT name FROM todo");
$todofeed .= '<div class="title"> <ul>';     	 
while($row = mysql_fetch_array($sql2))
{
	$name1 = $row["name"];
	$todofeed.='
	
			<li>' . $name1 . '</li>
		
	
	';
	
	$sql3 = mysql_query("SELECT id, todo FROM todo WHERE name='$name1' ");
	while($row = mysql_fetch_array($sql3))
	{$todo1 = $row["todo"];

		$todofeed.='
	<div class="items">
	<ul>
		<li>' . $todo1 . '</li>
	</ul>	
	</div>
	';}
	
	
}
$todofeed .= '</div></ul>';     
print "$todofeed";

?>

im getting an output something like this:



What i want is to to be able to see only the items with filled bullets and then when i click on them i should see the rest via a jQuery effect...heres what i have tried so far with jQuery...which doesnt work...

<style type="text/css">
 div.title,div.items
{
text-align:center;
background-color:#999999;
font:large
}
div.items
{
display:none;
}
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">

$(document).ready(function(){
  $(".title").click(function(){
    $(".items").slideDown("slow");
  });
});

[Martyr2]

Well you attached the event to the containing div named title. I think you want to be attaching the click to the <li> elements of the title div. After all, it is the list items you are clicking (the ones with the filled bullets) to trigger the open of the other items.

Also keep in mind that if a lot of different items boxes are given the class "items" that when you click on one title it is going to open up all subitems because the slideDown is going to match all the div elements, not just the one for that item.

I also noticed that you closed your titles div before closing the </ul>. You want to switch those around.



Edit: Here is a fiddle to play with.... http://jsfiddle.net/jZcKa/

This post has been edited by Martyr2: 25 February 2012 - 04:38 PM