Problems with Form and FileInput Kartik-v

Hello dear, I want to expose a problem that I am having in one of my forms, the truth is that I have been with Yii2 for a few years, but I must be burned, it is rare and I can’t really find the solution. I summarize:

I have a form where I must also save two images, one of the front of a package and the back of it. I have already worked with images in the past, I use the kartik-v fileinput plugin. In fact I have it in other forms in the same application. From the front, I mean from the view, it allows me to select the images, but by giving it to save and review in the controller the array $_FILES does not bring anything, it comes empty, now, if I occupy the original input files of yii2. It leaves me perfectly, brings me the files. I have tried everything, put the plugin without configuration, without validation, with validation, various configurations, the strange thing is that the same configuration in another form works.

I am going to show my code to see if any one can give me a little light, I show the form and I show the controller along with the capture of the empty array and the array with data. I hope you can collaborate with me in this roll that I cannot advance. I thank you very much!

I use Yii2 version 2.0.30 over php 7.2.24 on linux mint.

I clarify that I have changed some names of entities for confidentiality with the client.

_form:

<?php

use yii\helpers\Html;
use yii\bootstrap4\ActiveForm;
use yii\helpers\ArrayHelper;
use kartik\file\FileInput;
use kartik\date\DatePicker;
use yii\helpers\Url;
use backend\models\Ro;
use backend\models\Ca;
use backend\models\No;
use backend\models\Co;
use backend\models\Roa;
use backend\models\Pro;
use backend\models\Roki;
use backend\models\Re;
use backend\models\Va;
use backend\models\Al;

/* @var $this yii\web\View */
/* @var $model backend\models\Co */
/* @var $form yii\bootstrap4\ActiveForm */
?>

<div class="row">
    <div class="col-6 col-md-12">
        <div class="card card-default">
			<div class="card-header">
				<h3 class="card-title">Datos principales</h3>
			</div>
			<div class="card-body">
                <div class="row">
                    <div class="col-12 col-md-6">
                    
                        <?php $form = ActiveForm::begin(['options' => ['enctype' => 'multipart/form-data']]); ?>
                        
                        <?= $form->field($model, 'ro_id')->dropDownList(
                            ArrayHelper::map(Ro::find()->all(), 'id', 'name'),
                            ['prompt' => '-- seleccione --']) ?>

                        <?= $form->field($model, 'co_id')->dropDownList(
                            ArrayHelper::map(Co::find()->all(), 'id', 'name'),
                            ['prompt' => '-- seleccione --']) ?>

                        <?= $form->field($model, 'origin')->dropDownList(
                            ArrayHelper::map(Co::find()->all(), 'id', 'name'),
                            ['prompt' => '-- seleccione --']) ?>

                        <?= $form->field($model, 'te_1')->dropDownList(
                            ArrayHelper::map(Ne::find()->all(), 'id', 'name'),
                            ['prompt' => '-- seleccione --']) ?>

                        <?= $form->field($model, 'te_2')->dropDownList(
                            ArrayHelper::map(Ne::find()->all(), 'id', 'name'),
                            ['prompt' => '-- seleccione --']) ?>

                        <?= $form->field($model, 'te_3')->dropDownList(
                            ArrayHelper::map(Ne::find()->all(), 'id', 'name'),
                            ['prompt' => '-- seleccione --']) ?>

                        <?= $form->field($model, 'ro_country')->dropDownList(
                            ArrayHelper::map(Country::find()->all(), 'id', 'name'),
                            ['prompt' => '-- seleccione --']) ?>

                        <?= $form->field($model, 'roa_type_id')->dropDownList(
                            ArrayHelper::map(RoaType::find()->all(), 'id', 'name'),
                            ['prompt' => '-- seleccione --']) ?>

                        <?= $form->field($model, 'cess_id')->dropDownList(
                            ArrayHelper::map(Cess::find()->all(), 'id', 'name'),
                            ['prompt' => '-- seleccione --']) ?>

                        <?= $form->field($model, 'rst_id')->dropDownList(
                            ArrayHelper::map(Rst::find()->all(), 'id', 'name'),
                            ['prompt' => '-- seleccione --']) ?>

                        <?= $form->field($model, 'region_id')->dropDownList(
                            ArrayHelper::map(Region::find()->all(), 'id', 'name'),
                            ['prompt' => '-- seleccione --']) ?>

                        <?= $form->field($model, 'vety_id')->dropDownList(
                            ArrayHelper::map(Vety::find()->all(), 'id', 'name'),
                            ['prompt' => '-- seleccione --']) ?>

                    </div>
                    <div class="col-12 col-md-6">
                        
                        <?= $form->field($model, 'de_since')->dropDownList(
                            ArrayHelper::map(De::find()->all(), 'id', 'quantity'),
                            ['prompt' => '-- seleccione --']) ?>
                            
                        <?= $form->field($model, 'ade_until')->dropDownList(
                            ArrayHelper::map(Ade::find()->all(), 'id', 'quantity'),
                            ['prompt' => '-- seleccione --']) ?>

                        <?= $form->field($model, 't_date')->widget(DatePicker::class, [
                                'type' => DatePicker::TYPE_COMPONENT_PREPEND,
                                // modify template for custom rendering
                                //'template' => '<div class="well well-sm" style="background-color: #fff; width:250px">{input}</div>',
                                'language' => 'es',
                                'pluginOptions' => [
                                    'autoclose' => true,
                                    'todayHighlight' => true,
                                    'todayBtn' => true,
                                    'format' => 'yyyy-mm-dd',
                                    'endDate' => date('Y-m-d'),
                                ],
                            ]) ?>

                        <?php //echo $form->field($model, 'file_1')->fileInput(); ?>

                        <?php //echo $form->field($model, 'file_2')->fileInput(); ?>

                        <?php
                        if (!$model->isNewRecord)
                        {
                            if (!empty($model->front_img) && file_exists($model->frontImg->url))
                            {
                                $dataFrontImg[0] = [
                                    'caption' => $model->frontImg->title,
                                    'size' => $model->frontImg->url,
                                    'url' => Url::to('delete-image'),
                                    'key' => $model->front_img
                                ];
                                
                                echo '<div class="alert alert-info alert-dismissible fade show" role="alert">
                                        <p><strong>Tenga en cuenta que si elimina la imagen será de manera permanente.</strong></p>
                                        <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                                            <span aria-hidden="true">&times;</span>
                                        </button>
                                    </div>';

                                echo $form->field($model, 'file_1')->widget(FileInput::class, [
                                    'options' => [
                                        'accept' => 'image/*',
                                    ],
                                    'pluginOptions' => [
                                        'showUpload' => false,
                                        'showRemove' => true,
                                        'initialPreview' => '/'.$model->frontImg->url,
                                        'initialPreviewAsData' => true,
                                        'overwriteInitial' => false,
                                        //'initialCaption' => "Seleccione imagenes para cargar o agregar",
                                        'initialPreviewConfig' => $dataFrontImg,
                                        'allowedFileExtensions' => ['png', 'jpg', 'gif', 'jpeg'],
                                        'maxFileSize' => 2048,
                                        'msgSizeTooLarge' => 'El archivo supera el límite permitido de <b>2mb</b>.',
                                    ],
                                    'pluginEvents' => [
                                        'filedeleted' => 'function(){swal("¡Se ha eliminado la imagen seleccionada!", "", "success", {button: "Cerrar"});}',
                                    ],
                                ])->label('Modificar imagen');
                            }
                            else
                            {
                                echo '<p style="color: red;"><strong>No se ha cargado ninguna imagen</strong></p>';
                                
                                echo $form->field($model, 'file_1')->widget(FileInput::class, [
                                    'options' => [
                                        'accept' => 'image/*',
                                    ],
                                    'pluginOptions' => [
                                        'showUpload' => false,
                                        'showRemove' => true,
                                        'allowedFileExtensions' => ['png', 'jpg', 'gif', 'jpeg'],
                                        'maxFileSize' => 2048,
                                        'msgSizeTooLarge' => 'El archivo supera el límite permitido de <b>2mb</b>.',
                                    ],
                                ]);
                            }

                            if (!empty($model->back_img) && file_exists($model->backImg->url))
                            {
                                $dataBackImg[0] = [
                                    'caption' => $model->backImg->title,
                                    'size' => $model->backImg->url,
                                    'url' => Url::to('delete-image'),
                                    'key' => $model->back_img,
                                ];
                                
                                echo '<div class="alert alert-info alert-dismissible fade show" role="alert">
                                        <p><strong>Tenga en cuenta que si elimina la imagen será de manera permanente.</strong></p>
                                        <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                                            <span aria-hidden="true">&times;</span>
                                        </button>
                                    </div>';

                                echo $form->field($model, 'file_2')->widget(FileInput::class, [
                                    'options' => [
                                        'accept' => 'image/*',
                                    ],
                                    'pluginOptions' => [
                                        'showUpload' => false,
                                        'showRemove' => true,
                                        'initialPreview' => '/'.$model->backImg->url,
                                        'initialPreviewAsData' => true,
                                        'overwriteInitial' => false,
                                        //'initialCaption' => "Seleccione imagenes para cargar o agregar",
                                        'initialPreviewConfig' => $dataBackImg,
                                        'allowedFileExtensions' => ['png', 'jpg', 'gif', 'jpeg'],
                                        'maxFileSize' => 2048,
                                        'msgSizeTooLarge' => 'El archivo supera el límite permitido de <b>2mb</b>.',
                                    ],
                                    'pluginEvents' => [
                                        'filedeleted' => 'function(){swal("¡Se ha eliminado la imagen seleccionada!", "", "success", {button: "Cerrar"});}',
                                    ],
                                ])->label('Modificar imagen');
                            }
                            else
                            {
                                echo '<p style="color: red;"><strong>No se ha cargado ninguna imagen</strong></p>';
                                
                                echo $form->field($model, 'file_2')->widget(FileInput::class, [
                                    'options' => [
                                        'accept' => 'image/*',
                                    ],
                                    'pluginOptions' => [
                                        'showUpload' => false,
                                        'showRemove' => true,
                                        'allowedFileExtensions' => ['png', 'jpg', 'gif', 'jpeg'],
                                        'maxFileSize' => 2048,
                                        'msgSizeTooLarge' => 'El archivo supera el límite permitido de <b>2mb</b>.',
                                    ],
                                ]);
                            }
                        }
                        else
                        {
                            echo $form->field($model, 'file_1')->widget(FileInput::class, [
                                'options' => [
                                    'accept' => 'image/*',
                                ],
                                'pluginOptions' => [
                                    'showUpload' => false,
                                    'showRemove' => true,
                                    'allowedFileExtensions' => ['png', 'jpg', 'gif', 'jpeg'],
                                    'maxFileSize' => 2048,
                                    'msgSizeTooLarge' => 'El archivo supera el límite permitido de <b>2mb</b>.',
                                ],
                            ]);

                            echo $form->field($model, 'file_2')->widget(FileInput::class, [
                                'options' => [
                                    'accept' => 'image/*',
                                ],
                                'pluginOptions' => [
                                    'showUpload' => false,
                                    'showRemove' => true,
                                    'allowedFileExtensions' => ['png', 'jpg', 'gif', 'jpeg'],
                                    'maxFileSize' => 2048,
                                    'msgSizeTooLarge' => 'El archivo supera el límite permitido de <b>2mb</b>.',
                                ],
                            ]);
                        }
                        ?>
                        
                    </div>
                    <div class="form-group">

                        <?= Html::submitButton('Guardar', ['class' => 'btn btn-success']) ?>
                        
                        <?= Html::a('Cancelar', ['index'], ['class' => 'btn btn-danger']) ?>

                    </div>

                    <?php ActiveForm::end(); ?>

                </div>
			</div>
		</div>
    </div>
</div>

_controller:

In the controller I have more code, but I think it is enough to get an idea of the work.

public function actionCreate()
{
    $model = new Cabel();

if ($model->load(Yii::$app->request->post()) && $model->validate())
{
    echo '<pre>';
    print_r($_FILES);
    echo '</pre>';
    exit();

    $model->file_1 = UploadedFile::getInstance($model, 'file_1');
    $model->file_2 = UploadedFile::getInstance($model, 'file_2');
   }
}

Instead if I use the inputs from yii2 it brings them to me, look:

try change the post_max_size,upload_max_filesize , post_max_size, in pgp.ini … i had a similar issue with video files

1 Like

Hello dear! Thank you very much for answering! The problem does not come there, since if I use the original yii2 inputs it does not make me any problem, also I have uploaded images that do not reach 1mb so it is not the problem. The same widget in another form works perfectly for me, so it is not a server problem … I am quite lost.

why do u have two fields with the name >field($model, ‘file_2’) and >field($model, ‘file_1’) in your view? maybe it’s are overwritten it?

Dear, thank you very much for your reply, they are not overwritten, in fact if you pay attention to what I mention, when I occupy the two original yii2 inputs so to call them, everything works fine, the problem is with the kartik-v widget. Now in turn that widget works well on other screens of the same application.

One can have many inputFiles the issue is that they are using different model names. In fact I tried to use only one and it doesn’t send anything either …

Thank you!

Something that is calling my attention by continuing to review this problem, is that when I use the inputs of the kartik-v widget it sends me in the FormData headers, and when I use the yii2 inputs it does not send it, that catches my attention. I don’t know if someone could help me with a little light on the subject …

Thank you! Attached screenshots.