JQuery collapsable Panel

Question

How does the Jquery use to create similar to Ajax CollapsiblePanel?

Answer 1

Manually: Have a div for the header (which will be clicked to expand and collapse), and another div for the content (which will have the matter to be displayed).

here's an example.

//To Show
$('#myheader1').click(function(){$('#mycontent1').Show())};

//To Show
$('#myheader1').click(function(){$('#mycontent1').Hide())};

You'll have to maintain the visibility status in a variable.

Ready control

http://plugins.jquery.com/project/accordion

Answer 2

Thanks for your reply. I want to use in Listview item template for each row item. Is there any example which will show it uses with ASP.NET data controls?

Answer 3

Try this:

<ItemTemplate>
    <span class="title">Show/Hide</span>
    <div>
       <!-- put some elements here... -->
    </div>
</ItemTemplate>

---

$(".title").click(function() { $(this).next("div").slideToggle("slow"); });