CJui accordion / tab elements within forms problem

Yii 1.1 General Discussion
1

I’m having trouble getting Jquery UI Accordion to work withing a form (modified from the Update form that the UI creator makes). Here’s my code:




<div class="form">


<?php $form=$this->beginWidget('CActiveForm', array(

	'id'=>'order-form',

	'enableAjaxValidation'=>false,

)); ?>


	<p class="note">Fields with <span class="required">*</span> are required.</p>

	

	<?php  $this->renderPartial('_form-section-order-summary', array('form'=>$form, 'model'=>$model)); ?>

			

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

    'panels'=>array(

        'Customer Details'=>$this->renderPartial('_form-section-customer-details', array('form'=>$form, 'model'=>$model)),

        'E-Commerce'=>$this->renderPartial('_form-section-ecommerce', array('form'=>$form, 'model'=>$model)),

    	'User Data'=>  $this->renderPartial('_form-section-user-data', array('form'=>$form, 'model'=>$model)),

    	'Text Messaging'=>$this->renderPartial('_form-section-text-messaging', array('form'=>$form, 'model'=>$model)),

    	'Other Options'=>$this->renderPartial('_form-section-other-options', array('form'=>$form, 'model'=>$model)),	    		

    ),

    // additional javascript options for the accordion plugin

    'options'=>array(

        'animated'=>'bounceslide',

    ),

));


	?>

Each of those partial views is a separate file contaning a section of the form. When I run this, it displays the entire form (including all the sections), and then the Jquery accordion sections (without content) appear at the bottom, below the form.

How do I fix this?

2

Hi igray,

You have to set the 3rd parameter of renderPartial to true, in order to let it return the rendering result as a string instead of echoing it immediatlely.




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

    'panels'=>array(

        'Customer Details'=>$this->renderPartial('_form-section-customer-details',

             array('form'=>$form, 'model'=>$model),

             true),

        ...

    ),

    // additional javascript options for the accordion plugin

    'options'=>array(

        'animated'=>'bounceslide',

    ),

));

http://www.yiiframework.com/doc/api/1.1/CController#renderPartial-detail

3

Thanks - that worked perfectly!