Yii2 动态表单在单击添加按钮时不添加新字段

Yii2 dynamic form not adding new field on clicking Add button

我已经在我的 Yii2 应用程序中集成了 "wbraganca Yii2 dynamic form",但是当我点击添加 (+) 按钮时,新字段没有被添加,并且在控制台中出现以下错误:

Uncaught ReferenceError: dynamicform_1b7f3e0d is not defined

请不要将其标记为重复,因为到目前为止我还没有找到解决此问题的方法。提前致谢。

这是我的小部件代码:

<?php $form = ActiveForm::begin(['id' => 'dynamic-form']); ?>
<div class="row">
    <div class="col-sm-6">
        <?= $form->field($model, 'name')->textInput(['maxlength' => true]) ?>
    </div>
    <div class="col-sm-6">
        <?= $form->field($model, 'note')->textInput(['maxlength' => true]) ?>
    </div>
</div>

<div class="panel panel-default">
    <div class="panel-heading"><h4><i class="glyphicon glyphicon-envelope"></i> Addresses</h4></div>
    <div class="panel-body">
         <?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' => 4, // 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' => $aps[0],
            'formId' => 'dynamic-form',
            'formFields' => [
                'product_id',
                'pest_disease_id',
            ],
        ]); ?>

        <div class="container-items"><!-- widgetContainer -->
        <?php foreach ($aps as $i => $ap): ?>
            <div class="item panel panel-default"><!-- widgetBody -->
                <div class="panel-heading">
                    <h3 class="panel-title pull-left">Address</h3>
                    <div class="pull-right">
                        <button type="button" class="add-item btn btn-success btn-xs"><i class="glyphicon glyphicon-plus"></i></button>
                        <button type="button" class="remove-item btn btn-danger btn-xs"><i class="glyphicon glyphicon-minus"></i></button>
                    </div>
                    <div class="clearfix"></div>
                </div>
                <div class="panel-body">
                    <?php
                        // necessary for update action.
                        if (! $ap->isNewRecord) {
                            echo Html::activeHiddenInput($ap, "[{$i}]id");
                        }
                    ?>

                    <div class="row">
                        <div class="col-sm-6">
                            <?= $form->field($ap, "[{$i}]product_id")->textInput(['maxlength' => true]) ?>
                        </div>
                        <div class="col-sm-6">
                            <?= $form->field($ap, "[{$i}]pest_disease_id")->textInput(['maxlength' => true]) ?>
                        </div>
                    </div><!-- .row -->

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

<div class="form-group">
    <?= Html::submitButton($ap->isNewRecord ? 'Create' : 'Update', ['class' => 'btn btn-primary']) ?>
</div>

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

我在 DynamicFormWidget class 中发现了问题,js 在 POS_HEAD 位置受保护

没有渲染
protected function registerOptions($view)
{  
    $encOptions = Json::encode($this->_options);

    $this->_hashVar = DynamicFormWidget::HASH_VAR_BASE_NAME . hash('crc32', $encOptions);
    $view->registerJs("var {$this->_hashVar} = {$encOptions};\n", $view::POS_HEAD);
    //$view->registerJs("var {$this->_hashVar} = {$encOptions};\n", $view::POS_READY);
}

如果我将位置更改为 POS_READY,则 javascript 代码得到呈现,但随后删除按钮停止工作。

请将此代码替换为您的 DynamicFormWidget class:

protected function registerOptions($view)
{  
    $encOptions = Json::encode($this->_options);

$this->_hashVar = DynamicFormWidget::HASH_VAR_BASE_NAME . hash('crc32', $encOptions);
$view->registerJs("var {$this->_hashVar} = {$encOptions};\n", $view::POS_END);
}

您需要将脚本定位从 POS_HEAD 更改为 POS_END