Yiibooster + Redactor Row + Modal

I’m currently using redactor in a bootstrap modal, as a means of editing content on a web page. The user clicks a button next to the content area, a modal opens with the content from the content area displayed in a redactor editor. For some reason, the first time the button is clicked and the modal is displayed, the content appears in a plain textbox and firebug displays the following message:

TypeError: jQuery(…).redactor is not a function

However, any subsequent modal shows the content properly in a redactor editor. The entire process works great - just not for that first click.

View:




...

<div class="row">

	<?php if(isset($this->contentAreas[3])) {

	

		echo '<div class="span12" id="ca'.$this->contentAreas[3]->id.'" '.$editStyle.'>';

		

		echo $this->renderPartial('application.modules.gigafit.views.contentArea._contentarea', array('id'=>$this->contentAreas[3]->id), true, false, $this);

			

		echo '</div>';

	} ?>

</div>

...



Controller:




public function actionEditcontentarea($id)

	{

		$model=$this->loadModel($id);

		

		if (isset($_POST['ContentArea'])) {

			$model->attributes = $_POST['ContentArea'];

				

			$this->performAjaxValidation($model, 'content-area-form');

			

			if($model->save()) {

                if (Yii::app()->request->isAjaxRequest) {

                    echo CJSON::encode(array(

                        'status' => 'success',

                        'div' => $this->renderPartial('_contentarea', array(

                            'id'=>$model->id), $this, false, true

                        )));


                    Yii::app()->end();

                }

			} else {

                if (Yii::app()->request->isAjaxRequest) {

                    echo CJSON::encode(array(

                            'status' => 'failure',

                            'div' => $this->renderPartial('_editcontentarea', array(

                                        'model'=>$model), $this, true, true

                                ),

                        )),


                        Yii::app()->end();

                }

            }

			

		} else {

            if (Yii::app()->request->isAjaxRequest) {

                echo CJSON::encode(array(

                    'status' => 'failure',

                    'div' => $this->renderPartial('_editcontentarea', array(

                            'model'=>$model), $this, true, true

                        ),

                    )),


                Yii::app()->end();

            }

		}

	}



Modal content:




<?php

Yii::app()->clientScript->scriptMap['jquery.js'] = false;

Yii::app()->clientScript->scriptMap['jquery.min.js'] = false;

Yii::app()->clientScript->scriptMap['bootstrap.min.js'] = false;

Yii::app()->clientScript->scriptMap['bootstrap.bootbox.min.js'] = false;


Yii::app()->clientScript->scriptMap['bootstrap.min.css'] = false;

Yii::app()->clientScript->scriptMap['bootstrap-responsive.min.css'] = false;

Yii::app()->clientScript->scriptMap['bootstrap-yii.css'] = false;

Yii::app()->clientScript->scriptMap['jquery-ui-bootstrap.css'] = false;


$form=$this->beginWidget('bootstrap.widgets.TbActiveForm',array(

	'id'=>'content-area-form',

	'enableAjaxValidation'=>false,

)); ?>


	<?php echo $form->errorSummary($model); ?>


	<?php echo $form->redactorRow($model,'content',array('rows'=>40)); ?>


	<?php $this->widget('bootstrap.widgets.TbButton', array(

			'buttonType'=>'submit',

			'type'=>'primary',

			'label'=>'Save',

            'htmlOptions'=>array(

                'class'=>'pull-right',

            )

		)); ?>


<?php $this->endWidget(); ?>