Cropbox widget not working in modal window

[gesero]

Please help. In modal window cannot upload and crop image file.

[bupy7]

Give me your code, please, and version yii2-widget-cropbox.

[gesero]

Version "bupy7/yii2-widget-cropbox": "2.2"

JS for activate modal function updateprofile(type, id){ $.ajax({ type:'POST', url:'index.php?r=controller%2Faction&Id='+id+'&type='+type, success: function(data) { $('#myModal').html(data); $('#myModal').modal(); } }); }

In main layout div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" /div

In controller $model = Model::find()->where('(id = :id)', [':id' => $Id,])->one(); if (Yii::$app->request->isAjax && $model->load(Yii::$app->request->post())) { if ($model->validate()) { $model->image = \yii\web\UploadedFile::getInstance($model, 'image'); $model->save(); return $this->redirect(['/account/profile']); } Yii::$app->response->format = 'json'; return \yii\widgets\ActiveForm::validate($model); }

    return $this->renderAjax('popUpUpdate', [
        'model' => $model,
    ]);

In view

popUpUpdate.txt

[bupy7]

What specifically is not working? Describe a situation.

[gesero]

In modal window cannot upload and crop image. See code above.

[bupy7]

@Geser1979 Attach browser console log after it actions.

[gesero]

After action in console i see this

Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check http://xhr.spec.whatwg.org/.

[bupy7]

You can attach screenshot of console log?

[bupy7]

You load yii2-widget-cropbox via Ajax. It is not related to his work. You sure that all JS scripts of yii2-widget-cropbox has been loaded? Check it.

[gesero]

Yes, all JS scripts has been loaded. So widget cannot work via Ajax?

[bupy7]

Can do it. But I not understand that is problem. Try set custom id of widget as below:

echo $form->field($model, 'image')->widget(Cropbox::className(), [
    'attributeCropInfo' => 'crop_info',
    'id' => uniqid(),
]);

[bupy7]

@Geser1979 Yes, if you uses other widgets before call the modal with yii2-widget-cropbox, then most likely ID of #w{N} already busy and yii2-widget-cropbox adds event for #w{N} element. You need easy make unique ID of yii2-widget-cropbox.

[gesero]

Yes, now widget works in modal window, but after submit there is nothing in GLOBAL _FILES and image does not update. Are there another settings for this?

[bupy7]

Add enctype to form.

use bupy7\cropbox\Cropbox;

$form = ActiveForm::begin([
    'options' => ['enctype'=>'multipart/form-data'],
]);

...

echo $form->field($model, 'image')->widget(Cropbox::className(), [
    ...
]);

...

[gesero]

All works! Thanks!