Best way to load a html fragment in collapsible panel?

Question

I am trying to make my collapsible panel with a default state
of closed, load the contents of a URL when the panel is opened.
Can I use a html spry panel in the collapsiblePanelContent
that is triggered when the CollapsiblePanelTab is clicked to be
opened?

Answer 1

Thanks for the quick response V1. I am trying to wrap my mind
around your example, but having a little trouble. Here is what I
did starting with the basic collapsible panel: Sorry for the a
href's getting changed by the forum (is there a code tag?)
<div class="CollapsiblePanel" id="CollapsiblePanel1" >
<div class="CollapsiblePanelTab" tabindex="0">Fall
2008 Course Listing</div>
<div class="CollapsiblePanelContent">
</div>
</div>
and I want to load the content of this URL result:
http://catalog.smith.edu/results.php?term=200901&amp;department=GOV&amp;instructor=all&amp ;credits=all&amp;course_number=&amp;keyword=&amp;attribute=
So going from the
adobe
lab panel sample
I tried this (which did not work):
<div class="CollapsiblePanel" id="CollapsiblePanel1">
<div class="CollapsiblePanelTab" tabindex="0"><a
href="#" onclick="course.loadContent('
http://catalog.smith.edu/results.php?term=200901&amp;department=GOV&amp;instructor=all&amp ;credits=all&amp;course_number=&amp;keyword=&amp;attribute=');">Fall
2008 Course Listing</a></div>
<div class="CollapsiblePanelContent">
<div id="courses">Course content</div>
</div>
</div>
and the script (appropriate css and js loaded):
<script type="text/javascript">
<!--
var CollapsiblePanel1 = new
Spry.Widget.CollapsiblePanel("CollapsiblePanel1",
{contentIsOpen:false});
var course = new Spry.Widget.HTMLPanel("courses");
//-->
</script>