在Yii Markitup小部件中加载图像

时间:2012-07-30 16:42:30

标签: jquery yii markitup

我正在尝试在Yii EMarkitupWidget中加载图像。所以我用multipart/form-data form打开模态窗口,上传图片,并尝试从带有图片网址的控制器获取回调。之后,我需要将上传的图片网址粘贴到markitup窗口。

我该怎么办?我正在尝试这个:

set.js: {name:'Picture', key:'P', call: 'markitupimageupload'},

此功能打开模态窗口:

function markitupimageupload(){
    $('#mymodal').dialog('open');
}

具有以下形式的模态窗口:

<?php $this->beginWidget('zii.widgets.jui.CJuiDialog', array(
    'id'=>'mymodal',
    'options'=>array(
        'title'=>'Image Upload',
        'width'=>400,
        'height'=>200,
        'autoOpen'=>false,
        'resizable'=>false,
        'modal'=>true,
        'closeOnEscape' => true,
    ),
)); ?>
<?php $model=new ImageForm();
    $this->renderPartial('application.views.site.image',array('model'=>$model));
?>
<?php $this->endWidget('zii.widgets.jui.CJuiDialog'); ?>

形式:

class ImageForm extends CFormModel {
public $image;
// другие свойства

public function rules(){
    return array(
        // устанавливаем правила для файла, позволяющие загружать
        // только картинки!
        array('image', 'file', 'types'=>'jpg, gif, png'),
    );
}
}

表单视图:

<div class="form">
    <?php $form=$this->beginWidget('CActiveForm', array(
    'id'=>'image-upload-form',
    'action'=>array('/image/uploadnew'),
    'enableClientValidation'=>true,
    'clientOptions'=>array(
        'validateOnSubmit'=>true,
    ),
    'htmlOptions'=>array('enctype'=>'multipart/form-data'),
)); ?>

    <?php echo CHtml::errorSummary($model); ?>

    <div class="row">
        <?php echo $form->labelEx($model,'image'); ?>
        <?php echo CHtml::activeFileField($model,'image'); ?>
        <?php echo CHtml::error($model,'image'); ?>
    </div>

    <div class="row buttons">
        <?php echo CHtml::ajaxSubmitButton('Upload','/websnippets/image/uploadnew',
        array('type' => 'POST',
            'success' => 'function(){ $("#mymodal").dialog("close");}',));
        //echo CHtml::submitButton('Upload');
        ?>
    </div>

    <?php $this->endWidget(); ?>
</div><!-- form -->

问题:然后我使用CHtml :: submitButton('Upload'),文件正在上传OK。但我需要获取文件名网址。然后我使用CHtml :: ajaxSubmitButton,我可以采取Json响应,但文件没有加载。怎么解决这个问题?

2 个答案:

答案 0 :(得分:0)

在actionUploadnew控制器中返回文件名 - 例如:

echo CJSON::encode(array('filepath'=>$filepath));

在你的回调javascript中,您可以像访问它一样访问它:

'success' => 'function(data){ console.log(data.filepath); }'

答案 1 :(得分:0)

有一个jQuery form plugin,即使您有文件,也可以通过AJAX提交表单。它非常易于使用且功能强大。您可以将表单提交给返回带有文件名的JSON编码对象的操作,然后使用该操作。