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 should i start to make it more easy for you.I assume you have a little experience with ajaxLink etc although i will try to be as much 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 ActioAddnew. ¶

~ `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) {
                $this->renderPartial('createDialog',array('model'=>$model,),false,true);
            }
    }

####Where to pay attention:
I think this 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'=>false,
                    '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.