插入新元素后更新Yii下拉列表

时间:2013-08-01 00:17:24

标签: php javascript jquery ajax yii

这是我的代码:

<p>
  <?php echo $form->labelEx($model,'phone_type'); ?>
  <span class="field">
  <?php echo $form->dropDownList($model,'phone_type', 
     CHtml::listData(PhonesTypes::model()->findAll(),
 'id','type' )); ?>     
  <?php echo $form->error($model,'phone_type'); ?>
</span>                                 
</p>

将会有一个按钮来注册新的手机类型。因此,在表单的子表示之后,将在CJUiDialog内部,我希望上面的dropDownList可以使用新类型进行更新,而无需刷新页面。

我谷歌很多,但我只在Yii找到与“依赖性下拉”相关的内容。

解决此问题的更好方法是什么?是否有类似$.fn.cgridview.update的内容?

这是Dialog代码:

<?php  $this->endWidget('zii.widgets.jui.CJuiDialog');

  $this->beginWidget('zii.widgets.jui.CJuiDialog', array(
   'id'=>'dialog-crud',
   'options'=>array(
    'title'=>'Create new Phone Type',
    'autoOpen'=>false,
    'modal'=>true,
    'width'=>1080,
    'height'=>820,
    'resizable'=>false
    ),
  ));
 ?>

<iframe src="http://myapp/phone_types/create"  width="100%" height="100%"></iframe>

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

控制器的代码是一个简单的创建函数:

public function actionCreate(){

$model = new PhoneType;

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

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

  if( $model->save() ){

    //----> some suggestion here? echo CHtml::script("");
    Yii::app()->end();

  }
 }
}

所以,下面是我的解决方案的代码。 在视图中:

<?php $this->beginWidget('zii.widgets.jui.CJuiDialog', array(
  'id'=>'dialog',
  'options'=>array(
    'title'=>'Phone Types',
    'autoOpen'=>false,
    'modal'=>true,
    'width'=>1080,
    'height'=>820,
    'resizable'=>false
  ),
  ));
 ?>
 <iframe src="phoneTypes/create" id="cru-frame" width="100%" height="100%"></iframe>
 <?php $this->endWidget(); ?>

在我的PhoneTypesController中:

public function actionCreate(){

    $model = new PhoneTypes;

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

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

        if($model->save()){             

            echo CHtml::script("
                window.parent.$('#dialog').dialog('close');
                window.parent.$('#Phone_types_id').append('<option value=".$model->id." >'+'".$model->type."'+'</option>');
            ");

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

    $this->render('create',array(
        'model'=>$model,
    ));
}

1 个答案:

答案 0 :(得分:0)

您可能有一个添加电话类型的操作(对于此示例,我们称之为phoneType / create)。

当您向该操作发送ajax请求以创建手机类型时,该操作应返回新创建的手机类型信息。然后,您可以使用jQuery将其添加到您的下拉列表中。

看看这个例子:

<?php
// In protected/controllers/PhoneTypeController.php
public function actionCreate($phoneType)
{
    $phoneType = new PhoneType;
    $phoneType->phone_type = $phoneType;
    if ($phoneType->save())
    {
        echo CJSON::encode(array('value' => $phoneType->id, 'label' => $phoneType->phone_type)); // echos something like {"value":5,"label":"test"}
    }
}
?>

对于本例的其余部分,我将假设你的原始模型(你有一个phone_type字段的那个)被称为公司(这对我在选择你的phone_type下拉列表的jQuery代码有影响)。

然后,您可以在ajax函数的成功回调中使用此输出,为您的select(I.E.下拉列表)添加一个新选项:

jQuery.get( // your 'data' and 'url' here
    success: function(data) {
        $('#Company_phone_type').append('<option value="' + data.value + '">' + data.label + '</option>');
});

有关如何在jQuery中执行此操作的详细信息,请参阅Adding options to a select using Jquery/javascript