Cjuiaccordion Lazy Load

Apologies if there is a demo out there, but I have not been able to find it.

I have an Accordion that is dynamically built but would like to refactor to load a panel’s content only when it becomes active. So far, I rooted out everything but the header build from a summary query and a generic “Loading…” div in each panel. So the controller has:




    public function actionVolunteers()

    {

        $this->render('overview', array(

            'areaTotals' => Area::volunteerTotals(),

        ));

    }



…and the view, in part, builds stripped-down the Accordion from this:




<?php

    $panels = array();

    foreach ($areaTotals as $total) {

        $panels['Area ' .  $total['area'] . ': ' . $total['volunteers']] = 

            '<div id=' . $total['area'] . '>Loading ...</div>';

    } 

?>


<h4>Current Volunteers Summary</h4> 


<?php

    $this->widget('zii.widgets.jui.CJuiAccordion',array(

        'panels'=> $panels,

        'options'=>array(

            'collapsible'       => TRUE,

            'active'            => FALSE,

        ),

    ));

?>




What I want to do is AJAX back to the controller to get a JSON response with content for the panel when activated. I have to pass back the area value for the panel that is being activated. I know how to write the controller action, but I am not sure how to initiate it from the widget. I assume it has to happen from the activate or beforeActiveate event of the widget, right? Something like:





        'options'=>array(

            'collapsible'       => TRUE,

            'active'            => FALSE,

            'beforeActivate' => 'js:function(event, ui) {

           // do the Ajax call using get or post here

             },

        ),




Does anyone have a working example of how the callback might look?

(I have never tried to lazy load an accordion this way.)

Thanks in advance…

Since I didn’t get any replies, I muddled through it myself and posted a stripped down example. If anyone is interested, you can look here.

It’s not terribly elegant, so I am open to any suggestions for improvement.

Joe