Hello ppl. Even though i have a small experience with yii I though of writing this to help people which want to do something similar.

Scenario ¶

1. What we will use
2. Code and details

We have a model Person how represent persons. The person has a Job. The user must select a job from a dropdownlist when he creates the person. What if the person's job is not listed in the dropdownlist and we don't want to redirect user to the job/create page. Here comes the CJuiDialog. We will create a CJuiDialog ( a modal one ;) and we will create a new job and the new job inserted will be also appended to the existing dropdowlist.

What we will use ¶

1. AjaxLink: ¶

We will use an ajaxLink which will be located to the person/views/_form.php ( we will call it _form from now on ) where we create the person. The role of this ajaxLink will be to open the CJuiDialog.

2. JobController ActionAddnew: ¶

The ajaxLink will call an action in the JobController with name ActionAddnew ( we will call it Addnew from now on ), which will either save the job ( after validation ) either rendering the job form.

3. _FormDialog: ¶

Finally, the job form which consist of a create.php view and a _formDialog.php view, both exist under under job/views/. The _formDialog.php ( we will call it _formDialog from now on ) will contain an ajaxSubmitButton to submit the Job we want to create.

Code and details ¶

Now, I don't know from where exactly I should start to make it easier for you. I assume you have a little experience with ajaxLink etc., though I will try to be as detailed as I can.

_form. The person's create form. ¶

~ `php

<?php echo $form->dropDownList($person,'jid',CHtml::listData(Job::model()->findAll(),'jid','jdescr'),array('prompt'=>'Select')); ?>
<?php echo CHtml::ajaxLink(Yii::t('job','Create Job'),$this->createUrl('job/addnew'),array(
	'onclick'=>'$("#jobDialog").dialog("open"); return false;',
	'update'=>'#jobDialog'
	),array('id'=>'showJobDialog'));?>
<div id="jobDialog"></div>

Where to pay attention: ¶

1. dropDownList

   $attribute set to 'jid'

2. ajaxLink

   $url calls the ActionAddnew in JobController.php

   $ajaxOptions has to do with #jobDialog the div after the ajaxLink which will contain the CJuiDialog after the 'update'

   and finally last but not least the $htmlOption where I set an id to the ajaxLink for avoiding some issues.

JobController. The ActionAddnew. ¶

~ `php public function actionAddnew() {

            $model=new Job;
	// Ajax Validation enabled
	$this->performAjaxValidation($model);
	// Flag to know if we will render the form or try to add 
	// new jon.
            $flag=true;
	if(isset($_POST['Job']))
	{       $flag=false;
		$model->attributes=$_POST['Job'];

		if($model->save()) {
		    //Return an <option> and select it
                        echo CHtml::tag('option',array (
                            'value'=>$model->jid,
                            'selected'=>true
                        ),CHtml::encode($model->jdescr),true);
                    }
            }
            if($flag) {
                Yii::app()->clientScript->scriptMap['jquery.js'] = false;
                $this->renderPartial('createDialog',array('model'=>$model,),false,true);
            }
    }

####Where to pay attention:
The scriptMap parameter is essential.  Without that line, jquery.js will be loaded again and can cause issues with javascript both already existing on the page, as well as duplicated event handlers for ajax calls run multiple times that contain their own javascript.  You may want to use scriptMap to prevent other js files from loading again using '*.js' as the array key.

I think the rest is straightforward. Pay attention the last 2 parameters of [renderPartial](http://www.yiiframework.com/doc/api/CController#renderPartial-detail)
We call first the `createDialog.php` from `job/views/` which is the following.

### createDialog.php
~
```php
<?php 
$this->beginWidget('zii.widgets.jui.CJuiDialog',array(
                'id'=>'jobDialog',
                'options'=>array(
                    'title'=>Yii::t('job','Create Job'),
                    'autoOpen'=>true,
                    'modal'=>'true',
                    'width'=>'auto',
                    'height'=>'auto',
                ),
                ));
echo $this->renderPartial('_formDialog', array('model'=>$model)); ?>
<?php $this->endWidget('zii.widgets.jui.CJuiDialog');?>
```~
####Where to pay attention: 
The `'id'=>'jobDialog',` and step back to the `_form` "pay attention." :)
Here we initialize the `CJuiDialog widget` and we render the `_formDialog.php`

###_formDialog
~
```php
<div class="form" id="jobDialogForm">

<?php $form=$this->beginWidget('CActiveForm', array(
	'id'=>'job-form',
	'enableAjaxValidation'=>true,
)); 
//I have enableAjaxValidation set to true so i can validate on the fly the
?>

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

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

	<div class="row">
		<?php echo $form->labelEx($model,'jid'); ?>
		<?php echo $form->textField($model,'jid',array('size'=>60,'maxlength'=>90)); ?>
		<?php echo $form->error($model,'jid'); ?>
	</div>

	<div class="row">
		<?php echo $form->labelEx($model,'jdescr'); ?>
		<?php echo $form->textField($model,'jdescr',array('size'=>60,'maxlength'=>180)); ?>
		<?php echo $form->error($model,'jdescr'); ?>
	</div>

	<div class="row buttons">
		<?php echo CHtml::ajaxSubmitButton(Yii::t('job','Create Job'),CHtml::normalizeUrl(array('job/addnew','render'=>false)),array('success'=>'js: function(data) {
                        $("#Person_jid").append(data);
                        $("#jobDialog").dialog("close");
                    }'),array('id'=>'closeJobDialog')); ?>
	</div>

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

</div>
```~
####Where to pay attention:
1. In the `'success'` `js function` the `data` is the what the `ActioAddnew` echoes.

`$("#Person_jid").append(data);` This append the `data` to the `'jid'` `dropDownList` ( check `_form` ).

2. `$("#jobDialog").dialog("close");` We close the dialog.

3. `array('id'=>'closeJobDialog')` We give unique id for this `ajaxLink` to avoid issues as we said before.