I have a case to manage a dynamic input in yii2. So I choose this extension : wbraganca
This is my code :
<?php $form = ActiveForm::begin(['id' => 'dynamic-form']); ?>
<div class="row">
<div class="col-md-8">
<div class="padding-v-md">
<div class="line line-dashed"></div>
</div>
<?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' => $modelsTransactionDetail[0],
'formId' => 'dynamic-form',
'formFields' => [
'item_id',
'karyawan_id',
'harga_jual',
'jumlah_jual',
'subtotal'
],
]);
?>
<div class="panel panel-default">
<div class="panel-heading">
<i class="fa fa-money"></i> Item Pembelian
<div class="clearfix"></div>
</div>
<div class="panel-body"><!-- widgetContainer -->
<table class="table table-bordered table-striped container-items">
<thead>
<tr>
<th style="width: 30%">Item</th>
<th style="width: 15%">By</th>
<th style="width: 18%">Harga</th>
<th style="width: 8%">Qty</th>
<th style="width: 25%">Sub Total</th>
<th class="text-center" style="width: 5%">Act</th>
</tr>
</thead>
<tbody>
<?php foreach ($modelsTransactionDetail as $indexTools => $modelTools): ?>
<tr class="item">
<td class="vcenter">
<?=
$form->field($modelTools, "[{$indexTools}]item_id")->label(false)->dropDownList(
ArrayHelper::map(ItemLayanan::find()->all(), 'id', 'nama_item'), ['prompt' => 'Select item', 'class' => 'item_id']
)
?>
</td>
<td class="vcenter">
<?=
$form->field($modelTools, "[{$indexTools}]karyawan_id")->label(false)->dropDownList(
ArrayHelper::map(Karyawan::find()->all(), 'id', 'nama_karyawan'), ['prompt' => 'Select Karyawan']
)
?>
</td>
<td class="vcenter">
<?= $form->field($modelTools, "[{$indexTools}]harga_jual")->label(false)->textInput(['maxlength' => true]) ?>
</td>
<td class="vcenter">
<?= $form->field($modelTools, "[{$indexTools}]jumlah_jual")->label(false)->textInput(['maxlength' => true]) ?>
</td>
<td class="vcenter">
<?= $form->field($modelTools, "[{$indexTools}]subtotal")->label(false)->textInput() ?>
</td>
<td class="text-center vcenter" style="width: 90px;">
<button type="button" class="remove-item btn btn-danger btn-xs"><span class="glyphicon glyphicon-minus-sign"></span></button>
</td>
</tr>
<?php endforeach; ?>
</tbody>
<tfoot>
<tr>
<td colspan="5"></td>
<td><button type="button" class="add-item btn btn-success btn-sm"><span class="fa fa-plus"></span> New</button></td>
</tr>
</tfoot>
</table>
</div>
</div>
<?php DynamicFormWidget::end(); ?>
</div>
Please see in this pieces of code above :
<?=
$form->field($modelTools, "[{$indexTools}]item_id")->label(false)->dropDownList(
ArrayHelper::map(ItemLayanan::find()->all(), 'id', 'nama_item'), ['prompt' => 'Select item', 'class' => 'item_id']
)
?>
The question is, I have a register js, but why this js have work only just once, which is the first row, when I adding a row using wbraganca, it not works in new row:
This is my js
<?php
$js = <<<'EOD'
$(".item_id").on('change',function () {
alert();
});
EOD;
$this->registerJs($js);
?>