Yii2 : Dynamic Form wbraganca - php

Question

I want to use dynamic form widget (wbraganca). I tried it using the tutorial by 'doingItEasy' channel & also by github. And wrote following code :
controller code -
public function actionCreate()
{
$model = new Vendors();
$modelsSubCat = [new BusinessSubCategories];
if ($model->load(Yii::$app->request->post()) && $model->save()) {
$modelsSubCat = Model::createMultiple(BusinessSubCategories::classname());
Model::loadMultiple($modelsSubCat, Yii::$app->request->post());
// validate all models
$valid = $model->validate();
$valid = Model::validateMultiple($modelsSubCat) && $valid;
$modelsSubCat = Model::createMultiple(BusinessSubCategories::classname());
if ($valid) {
$transaction = \Yii::$app->db->beginTransaction();
try {
if ($flag = $model->save(false)) {
foreach ($modelsSubCat as $modelSubCat) {
$model->ven_sub_category_id = $modelSubCat->bsc_id;
if (! ($flag = $modelSubCat->save(false))) {
$transaction->rollBack();
break;
}
}
}
if ($flag) {
$transaction->commit();
return $this->redirect(['view', 'id' => $model->ven_id]);
}
} catch (Exception $e) {
$transaction->rollBack();
}
}
} else {
return $this->render('create', [
'model' => $model,
'modelsSubCat' => (empty($modelsSubCat)) ? [new BusinessSubCategories] : $modelsSubCat
]);
}
}
'_form.php' code -
<?php
use yii\helpers\Html;
use yii\widgets\ActiveForm;
use wbraganca\dynamicform\DynamicFormWidget;
?>
<div class="vendors-form">
<?php $form = ActiveForm::begin(['id' => 'dynamic-form']); ?>
<?= $form->field($model, 'ven_company_name')->textInput(['maxlength' => true]) ?>
<?= $form->field($model, 'ven_main_category_id')->textInput(['maxlength' => true]) ?>
<?= $form->field($model, 'ven_sub_category_id')->textInput() ?>
<div class="row">
<div class="panel panel-default">
<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' => $modelsSubCat[0],
'formId' => 'dynamic-form',
'formFields' => [
// 'bsc_id',
'bsc_name',
'bsc_image',
'bsc_description',
'bmc_id',
],
]); ?>
<div class="container-items"><!-- widgetContainer -->
<?php foreach ($modelsSubCat as $i => $modelSubCat): ?>
<div class="item panel panel-default"><!-- widgetBody -->
<div class="panel-heading">
<h3 class="panel-title pull-left">Sub Categories</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 (! $modelSubCat->isNewRecord) {
echo Html::activeHiddenInput($modelSubCat, "[{$i}]id");
}
?>
<?= $form->field($modelSubCat, "[{$i}]bsc_name")->textInput(['maxlength' => true]) ?>
<div class="row">
<div class="col-sm-6">
<?= $form->field($modelSubCat, "[{$i}]bsc_image")->fileInput(); ?>
</div>
<div class="col-sm-6">
<?= $form->field($modelSubCat, "[{$i}]bsc_description")->textInput(['maxlength' => true]) ?>
</div>
</div><!-- .row -->
</div>
</div>
<?php endforeach; ?>
</div>
<?php DynamicFormWidget::end(); ?>
</div>
</div>
<?= $form->field($model, 'ven_services_offered')->textInput(['maxlength' => true]) ?>
<?= $form->field($model, 'ven_business_logo')->textInput(['maxlength' => true]) ?>
<?= $form->field($model, 'ven_company_descr')->textInput(['maxlength' => true]) ?>
<?= $form->field($model, 'ven_established_date')->textInput() ?>
<?= $form->field($model, 'ven_noof_emp')->textInput() ?>
<?= $form->field($model, 'ven_branches_loc')->textInput(['maxlength' => true]) ?>
<?= $form->field($model, 'ven_market_area')->textInput(['maxlength' => true]) ?>
<?= $form->field($model, 'ven_website')->textInput(['maxlength' => true]) ?>
<?= $form->field($model, 'ven_specialized_in')->textInput(['maxlength' => true]) ?>
<?= $form->field($model, 'ven_contact_no')->textInput(['maxlength' => true]) ?>
<?= $form->field($model, 'ven_email_id')->textInput(['maxlength' => true]) ?>
<?= $form->field($model, 'ven_address')->textInput(['maxlength' => true]) ?>
<?= $form->field($model, 'ven_country_id')->textInput() ?>
<?= $form->field($model, 'ven_state_id')->textInput() ?>
<?= $form->field($model, 'ven_city_id')->textInput() ?>
<?= $form->field($model, 'ven_location_id')->textInput() ?>
<?= $form->field($model, 'ven_zip')->textInput(['maxlength' => true]) ?>
<?= $form->field($model, 'ven_contact_person_id')->textInput() ?>
<?= $form->field($model, 'ven_verified')->dropDownList([ 'Y' => 'Y', 'N' => 'N', ], ['prompt' => '']) ?>
<?= $form->field($model, 'ven_created')->textInput() ?>
<?= $form->field($model, 'ven_updated')->textInput() ?>
<?= $form->field($model, 'ven_deleted')->dropDownList([ 'Y' => 'Y', 'N' => 'N', ], ['prompt' => '']) ?>
<div class="form-group">
<?= Html::submitButton($model->isNewRecord ? Yii::t('app', 'Create') : Yii::t('app', 'Update'), ['class' => $model->isNewRecord ? 'btn btn-success' : 'btn btn-primary']) ?>
</div>
<?php ActiveForm::end(); ?>
</div>
<script type="text/javascript">
$(".dynamicform_wrapper").on("beforeInsert", function(e, item) {
console.log("beforeInsert");
});
$(".dynamicform_wrapper").on("afterInsert", function(e, item) {
console.log("afterInsert");
});
$(".dynamicform_wrapper").on("beforeDelete", function(e, item) {
if (! confirm("Are you sure you want to delete this item?")) {
return false;
}
return true;
});
$(".dynamicform_wrapper").on("afterDelete", function(e) {
console.log("Deleted item!");
});
$(".dynamicform_wrapper").on("limitReached", function(e, item) {
alert("Limit reached");
});
</script>
'create.php' code -
<?php
use yii\helpers\Html;
/* #var $this yii\web\View */
/* #var $model backend\models\Vendors */
$this->title = Yii::t('app', 'Create Vendors');
$this->params['breadcrumbs'][] = ['label' => Yii::t('app', 'Vendors'), 'url' => ['index']];
$this->params['breadcrumbs'][] = $this->title;
?>
<div class="vendors-create">
<h1><?= Html::encode($this->title) ?></h1>
<?= $this->render('_form', [
'model' => $model,
'modelsSubCat' => $modelsSubCat
]) ?>
</div>
But What happens is that the add/remove button is not working. I'm showing it's screenshot - Screenshot with Add/remove buttons

Answer 1

1)first add
$form = ActiveForm::begin([
'options' => [
'enctype' => 'multipart/form-data',
'id' => 'dynamic-form'
]
]);
instead your
2) delete 'bmc_id' from attributes of dynamic form or add textinput to dynamic form with bmc_id column
3) check if exist your model Model (...Model::loadMultiple($modelsSubCat, Yii::$app->request->post());)

Answer 2

I tried, but i can't reproduce this issue here. Can you try fix the following lines and see if the problem was there?
You are not closing the <div class="row"> after the dynamic form.
This could mess up the html code.
In your formFields, you don't need to add the 'bmc_id' if the
model have one. Remove it. By the way, you are using:
Html::activeHiddenInput($modelSubCat, "[{$i}]id");
Make sure this is the correct name of the attribute.
Non-related with your issue, you have a second:
$modelsSubCat = Model::createMultiple(BusinessSubCategories::classname());
After the loadMultiple method, making it useless.
EDIT
Just occurred to me: by any chance you have more than one DynamicForm in the same view? Or the code is the same as you posted?