here is whole form.
<?php
use yii\helpers\ArrayHelper;
use yii\helpers\Html;
use yii\widgets\ActiveForm;
use app\models\MaskedInput;
use kartik\date\DatePicker;
use kartik\select2\Select2;
use wbraganca\dynamicform\DynamicFormWidget;
/* @var $this yii\web\View */
/* @var $model app\models\PoPetani */
/* @var $form yii\widgets\ActiveForm */
?>
<div class="po-petani-form">
<?php $form = ActiveForm::begin(['id' => 'form-create-batch-po-petani']) ?>
<?php
echo '<label class="control-label">Tgl. Timbang</label>';
echo DatePicker::widget([
'name' => 'tgl_timbang',
'type' => DatePicker::TYPE_COMPONENT_APPEND,
'value' => date('d-m-Y'),
'pluginOptions' => [
'autoclose'=>true,
'format' => 'dd-mm-yyyy'
]
]);
echo '<label class="control-label">No. Polisi</label>';
echo Select2::widget([
'name' => 'vehicle_id',
'data' => ArrayHelper::map(\app\models\Vehicle::findAll(['listed' => true]), 'id', 'id'),
'options' => ['placeholder' => 'Select No. Polisi'],
'pluginOptions' => [
'allowClear' => true,
],
]);
?>
<div class="panel panel-default">
<div class="panel-heading"><h4><i class="glyphicon glyphicon-th-list"></i> Batch Insert</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' => 50, // 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' => $details[0],
'formId' => 'form-create-batch-po-petani',
'formFields' => [
'id',
'agen_id',
'netto',
'price',
'pot_pinjaman',
'total_rp'
],
]); ?>
<div class="container-items"><!-- widgetContainer -->
<?php foreach ($details as $i => $detail): ?>
<div class="item row">
<?php
// necessary for update action.
if (! $detail->isNewRecord) {
echo Html::activeHiddenInput($detail, "[{$i}]id");
}
?>
<div class="col-sm-8 col-md-3">
<?= $form->field($detail, "[{$i}]agen_id")->widget(Select2::className(), [
'data' => ArrayHelper::map(\app\models\Agen::find()->where(['role' => 'PETANI'])->all(), 'id', 'name'),
'language' => 'en',
'options' => ['placeholder' => 'Select petani ...'],
'pluginOptions' => [
'allowClear' => true,
],
]);
?>
</div>
<div class="col-sm-4 col-md-2">
<?= $form->field($detail, "[{$i}]netto")->widget(MaskedInput::className(),
[
'clientOptions' => [
'alias' => 'decimal',
'groupSeparator' => ',',
'digits' => 0,
'autoGroup' => true,
'removeMaskOnSubmit' => true,
'rightAlign' => false,
],
'options' => [
'class' => 'form-control',
'onchange' => 'calculateSubtotal($(this))',
]
]) ?>
</div>
<div class="col-sm-4 col-md-2">
<?= $form->field($detail, "[{$i}]price")->widget(MaskedInput::className(),
[
'clientOptions' => [
'alias' => 'numeric',
'groupSeparator' => ',',
'digits' => 0,
'autoGroup' => true,
'removeMaskOnSubmit' => true,
'rightAlign' => false,
],
'options' => [
'class' => 'form-control',
'onchange' => 'calculateSubtotal($(this))',
]
]) ?>
</div>
<div class="col-sm-4 col-md-2">
<?= $form->field($detail, "[{$i}]pot_pinjaman")->widget(MaskedInput::className(),
[
'clientOptions' => [
'alias' => 'numeric',
'groupSeparator' => ',',
'digits' => 0,
'autoGroup' => true,
'removeMaskOnSubmit' => true,
'rightAlign' => false,
],
'options' => [
'class' => 'form-control',
'onchange' => 'calculateSubtotal($(this))',
]
]) ?>
</div>
<div class="col-sm-4 col-md-2">
<?= $form->field($detail, "[{$i}]total_rp")->widget(MaskedInput::className(),
[
'clientOptions' => [
'alias' => 'numeric',
'groupSeparator' => ',',
'digits' => 0,
'autoGroup' => true,
'removeMaskOnSubmit' => true,
'rightAlign' => false,
],
'options' => [
'class' => 'form-control',
'readonly' => true
]
]) ?>
</div>
<div class="col-sm-2 col-md-1 item-action">
<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>
</div><!-- .row -->
<?php endforeach; ?>
</div>
<?php DynamicFormWidget::end(); ?>
</div>
</div>
<?php
echo Html::checkbox('transfer', true, [
'options' => [
'class' => 'form-control'
]
]);
echo '<label class="control-label"> Transfer</label>';
echo '<br>';
echo '<label class="control-label">Total Bayar</label>';
echo MaskedInput::widget([
'id' => 'total_bayar',
'name' => 'total_bayar',
'value' => 0,
'clientOptions' => [
'alias' => 'numeric',
'groupSeparator' => ',',
'digits' => 0,
'autoGroup' => true,
'removeMaskOnSubmit' => true,
'rightAlign' => false,
],
'options' => [
'class' => 'form-control',
'readonly' => true,
]
]);
echo '<label class="control-label">Total Netto</label>';
echo MaskedInput::widget([
'name' => 'total_netto',
'id' => 'total_netto',
'value' => 0,
'clientOptions' => [
'alias' => 'numeric',
'groupSeparator' => ',',
'digits' => 0,
'autoGroup' => true,
'removeMaskOnSubmit' => true,
'rightAlign' => false,
],
'options' => [
'class' => 'form-control',
'readonly' => true,
]
]);
echo '<label class="control-label">Total Pot. Pinjaman</label>';
echo MaskedInput::widget([
'id' => 'total_pot_pinjaman',
'name' => 'total_pot_pinjaman',
'value' => 0,
'clientOptions' => [
'alias' => 'numeric',
'groupSeparator' => ',',
'digits' => 0,
'autoGroup' => true,
'removeMaskOnSubmit' => true,
'rightAlign' => false,
],
'options' => [
'class' => 'form-control',
'readonly' => true,
]
]);
?>
<br>
<div class="form-group">
<?= Html::submitButton('Create' , ['class' => 'btn btn-success']) ?>
</div>
<?php ActiveForm::end() ?>
</div>
<?php
$script = <<< JS
jQuery(".dynamicform_wrapper").on("afterInsert", function(e, item) {
calculateTotal();
});
jQuery(".dynamicform_wrapper").on("afterDelete", function(e) {
calculateTotal();
});
function calculateSubtotal(item){
var index = item.attr("id").replace(/[^0-9.]/g, "");
var netto = $('#popetani-' + index + '-netto').val();
netto = netto == "" ? 0 : Number(netto.split(",").join(""));
var price = $('#popetani-' + index + '-price').val();
price = price == "" ? 0 : Number(price.split(",").join(""));
var pot_pinjaman = $('#popetani-' + index + '-pot_pinjaman').val();
pot_pinjaman = pot_pinjaman == "" ? 0 : Number(pot_pinjaman.split(",").join(""));
$('#popetani-' + index + '-total_rp').val((netto * price) - pot_pinjaman);
calculateTotal();
}
function calculateTotal(){
var total = 0;
var total_netto = 0;
var total_pot_pinjaman = 0;
jQuery(".dynamicform_wrapper .remove-item").each(function(index) {
var subtotal = $('#popetani-' + index + '-total_rp').val();
if(typeof(subtotal) != 'undefined'){
subtotal = subtotal == "" ? 0 : Number(subtotal.split(",").join(""));
total = total + subtotal;
}
var subtotal_netto = $('#popetani-' + index + '-netto').val();
if(typeof(subtotal_netto) != 'undefined'){
subtotal_netto = subtotal_netto == "" ? 0 : Number(subtotal_netto.split(",").join(""));
total_netto = total_netto + subtotal_netto;
}
var subtotal_pot_pinjaman = $('#popetani-' + index + '-pot_pinjaman').val();
if(typeof(subtotal_pot_pinjaman) != 'undefined'){
subtotal_pot_pinjaman = subtotal_pot_pinjaman == "" ? 0 : Number(subtotal_pot_pinjaman.split(",").join(""));
total_pot_pinjaman = total_pot_pinjaman + subtotal_pot_pinjaman;
}
});
$('#total_bayar').val(total);
$('#total_netto').val(total_netto);
$('#total_pot_pinjaman').val(total_pot_pinjaman);
}
function calculateTotalRp(){
var netto = $('#popetani-netto').val() == "" ? 0 : Number($('#popetani-netto').val().split(",").join(""));
var price = $('#popetani-price').val() == "" ? 0 : Number($('#popetani-price').val().split(",").join(""));
var pot_pinjaman = $('#popetani-pot_pinjaman').val() == "" ? 0 : Number($('#popetani-pot_pinjaman').val().split(",").join(""));
$('#popetani-total_rp').val((netto*price)-pot_pinjaman);
};
JS;
$this->registerJs($script, $this::POS_END);
?>
