Загрузка изображений в Yii Markitup Widget

Question

Я пытаюсь загрузить изображения в Yii EMarkitupWidget. Так что я открываю модальное окно с multipart/form-dataform, загружая изображение, и пытаясь получить обратный вызов от контроллера с URL-адресом изображения. После этого мне нужно вставить URL загруженного изображения в окно 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'), файл загружается нормально. Но мне нужно получить URL-адрес файла. Затем я использую CHtml::ajaxSubmitButton, я могу получить ответ Json, но файл не загружается. Как это решить?

Answer 1

Существует плагин форм jQuery, который позволит вам отправлять ваши формы через AJAX, даже если у вас есть файлы в них. Он очень прост в использовании и достаточно мощный. Вы можете отправить форму в действие, которое возвращает JSON-кодированный объект с именем файла, а затем работать с ним.

Answer 2

Верните имя файла в вашем контроллере actionUploadnew - например:

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

В вашем JavaScript обратного вызова вы получите к нему доступ, например:

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