Skip to content

Upload widget does not work - Dynamic form Yii2 starter kit #311

Description

@tpjasar

iam using the widget (trntv\filekit\widget \ Upload) of yii2-starter-kit, implement the use of the dynamic form (wbraganca\dynamicform\DynamicFormWidget), the problem is that the upload widget works only on the first element, when adding Other items fail to load correctly

_form

'dynamic-form']); ?>
<div class="col-sm-6">

    <?= $form->field($model, 'title')->textInput(['maxlength' => true]) ?>


    <?php echo $form->field($model, 'category_id')->dropDownList(\yii\helpers\ArrayHelper::map(
        $categories,
        'id',
        'name'
    ), ['prompt' => '']) ?>



    <?= $form->field($model, 'amount')->textInput() ?>

    <?= $form->field($model, 'delivery_charge')->textInput() ?>

    <?php echo $form->field($model, 'description')->widget(
        \yii\imperavi\Widget::class,
        [
            'plugins' => ['fullscreen', 'fontcolor', 'video'],
            'options' => [
                'minHeight' => 200,
                'maxHeight' => 200,
                'buttonSource' => true,
                'convertDivs' => false,
                'removeEmptyTags' => true,
                'imageUpload' => Yii::$app->urlManager->createUrl(['/file/storage/upload-imperavi']),
            ],
        ]
    ) ?>


</div>

<div class="col-md-6">

    <?php echo $form->field($model, 'attachments')->widget(
        Upload::class,
        [
            'url' => ['/file/storage/upload'],
            'maxFileSize' => 5000000, // 5 MiB,
            'acceptFileTypes' => new JsExpression('/(\.|\/)(gif|jpe?g|png)$/i'),
        ]
    );
    ?>

    <?= $form->field($model, 'availability')->widget(SwitchInput::className()); ?>

    <?= $form->field($model, 'status')->dropDownList(\common\models\Product::statuses()) ?>



    <?php echo $form->field($model, 'features')->widget(
        \yii\imperavi\Widget::class,
        [
            'plugins' => ['fullscreen', 'fontcolor', 'video'],
            'options' => [
                'minHeight' => 200,
                'maxHeight' => 200,
                'buttonSource' => true,
                'convertDivs' => false,
                'removeEmptyTags' => true,
                'imageUpload' => Yii::$app->urlManager->createUrl(['/file/storage/upload-imperavi']),
            ],
        ]
    ) ?>

</div>
<div class="col-md-10">

    <?php DynamicFormWidget::begin([
        'widgetContainer' => 'dynamicform_wrapper', // required: only alphanumeric characters plus "_" [A-Za-z0-9_]
        'widgetBody' => '.container-items', // required: css class selector
        'widgetItem' => '.item', // required: css class
        'limit' => 10, // the maximum times, an element can be cloned (default 999)
        'min' => 1, // 0 or 1 (default 1)
        'insertButton' => '.add-item', // css class
        'deleteButton' => '.remove-item', // css class
        'model' => $modelsIngredient[0],
        'formId' => 'dynamic-form',
        'formFields' => [
            'title',
            'description',
            'image',
            'featured_base_url',
            'featured_path'
        ],
    ]); ?>
    <div class="panel panel-default">
        <div class="panel-heading">
            <i class="fa fa-folder"></i> Product Ingredients
            <button type="button" class="pull-right add-item btn btn-success btn-xs"><i class="fa fa-plus"></i> Add
            </button>
            <div class="clearfix"></div>
        </div>
        <div class="panel-body container-items">
            <!-- widgetContainer -->
            <?php foreach ($modelsIngredient

                as $index => $modelIngredient) : ?>
                <div class="item panel panel-default">
                    <!-- widgetBody -->
                    <div class="panel-heading">
                        <span class="panel-title-address">Ingredients: <?= ($index + 1) ?></span>
                        <button type="button" class="pull-right remove-item btn btn-danger btn-xs"><i class="fa fa-minus"></i></button>
                        <div class="clearfix"></div>
                    </div>
                    <div class="panel-body">
                        <?php
                        // necessary for update action.
                        if (!$modelIngredient->isNewRecord) {
                            echo Html::activeHiddenInput($modelIngredient, "[{$index}]id");
                        }
                        ?>

                        <div class="col-md-12">

                            <?php echo $form->field($modelIngredient, "[{$index}]title")->textInput(); ?>

                        </div>

                        <div class="col-md-12">
                            

                            <?php echo $form->field($modelIngredient, "[{$index}]image")->widget(
                                Upload::class,
                                [
                                    'url' => ['/file/storage/upload'],
                                    'maxFileSize' => 5000000, // 5 MiB,
                                    'acceptFileTypes' => new JsExpression('/(\.|\/)(gif|jpe?g|png)$/i'),
                                ]
                            );
                            ?>

                        </div>

                        <div class="col-md-12">


                        <?php echo $form->field($modelIngredient, "[{$index}]description")->textarea(); ?>

            

                        </div>

                    </div>
                </div>
            <?php endforeach; ?>
        </div>
    </div>
    <?php DynamicFormWidget::end(); ?>

                    </div>

                    </div>


                    </div>


                 <div class="form-group">


                  <?= Html::submitButton($model->isNewRecord ? 'Create' : 'Update',    ['class'=>'btnbtnprimary'])      ?>


                </div>

              <?php ActiveForm::end(); 


               $js = '
               jQuery(".dynamicform_wrapper").on("afterInsert", function(e, item) {

               jQuery(".dynamicform_wrapper .panel-title-address").each(function(index) {

               jQuery(this).html("Ingredients: " + (index + 1))
               });
               });

              jQuery(".dynamicform_wrapper").on("afterDelete", function(e) {
              jQuery(".dynamicform_wrapper .panel-title-address").each(function(index) {
              jQuery(this).html("Ingredients: " + (index + 1))
               });
              });
             ';




             $this->registerJs($js);
              ?>

Screenshot_2020-12-05 Create Product

only first one is working the second one not working the value get null in controller.also second one css and js also not working.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions