yii2-dynamicform
yii2-dynamicform copied to clipboard
wbraganca
kartik select2 events
I'm using select2 in dynamic form,when I use events for select, the events works only for first nested form and It doesn't work for nested form that added by (+).How can I fix that?
I solved the problem by registering select2 event using kvListenEvent().
I placed the registration on afterInsert() yii2-dynamic-form event.
jQuery(".dynamicform_wrapper").on("afterInsert", function(e, item) {
var last_index = -1;
jQuery(".dynamicform_wrapper").on("afterInsert", function(e, item) {
jQuery(this).html("Produit: " + (index + 1));
last_index= index;
});
kvListenEvent("select2:select", jQuery("#factureventeelement-"+last_index+"-id_produit").kvSelector(), function() {
// do something
});
});
where
#factureventeelement-"+last_index+"-id_produit"
is the id of your item. If you find troubles to do it; share your code, and I'll try to help you.
Thanks.
@Nasreddine i have same problem here, and got error "kvListenEvent is not defined". Based on your example, "jQuery(this).html("Produit: " + (index + 1));" what is Produit? is it select2 name controller on my code?
Thanks.
here is my code:
`<?php
use yii\helpers\Html; //use yii\widgets\ActiveForm;
use yii\helpers\ArrayHelper; use kartik\select2\Select2; use wbraganca\dynamicform\DynamicFormWidget;
use app\models\Pelanggan; use app\models\Produk; use app\models\Orderitems;
use yii\bootstrap\ActiveForm; use kartik\date\DatePicker;
//$this->registerCssFile('http://localhost'.Yii::getAlias('@web').'/js/jquery-3.1.0.min.js');
/* @var $this yii\web\View / / @var $model app\models\Ordercustomer / / @var $form yii\widgets\ActiveForm */ ?>
registerJs(registerJs(
<?php
$form = ActiveForm::begin([
'id' => 'dynamic-form',
'layout' => 'horizontal',
'action' => ['index'],
'method' => 'post',
'fieldConfig' => [
'horizontalCssClasses' => [
'label' => 'col-sm-2',
'wrapper' => 'col-sm-6',
'error' => 'col-sm-12',
],
],
]);
?>
<div class="col-md-6">
<?= $form->field($model, 'tgldiminta')->widget(\yii\jui\DatePicker::classname(), [
'dateFormat' => 'dd-MM-yyyy',
])->textInput(['placeholder'=>'Deadline Date']) ?>
</div>
<div class="col-md-6">
<?php
echo $form->field($model, 'idcustomer')->widget(Select2::classname(), [
'data' => ArrayHelper::map(Pelanggan::find()->all(), 'id', 'namatoko'),
'options' => ['placeholder' => 'Select customer ...'],
'pluginOptions' => [
'allowClear' => true
],
])->label('Customer');
?>
</div>
<div class="col-md-6">
<?= $form->field($model, 'keterangan', [
'horizontalCssClasses' => [
'wrapper' => 'col-sm-10',
]
])->textInput(['maxlength' => true])->textInput(['placeholder'=>'Description']) ?>
</div>
<?php
DynamicFormWidget::begin([
'widgetContainer' => 'dynamicform_wrapper',
'widgetBody' => '.container-items',
'widgetItem' => '.item',
'min' => 0,
'insertButton' => '.add-item',
'deleteButton' => '.remove-item',
'model' => $modelItems[0],
'formId' => 'dynamic-form',
'formFields' => [
'idorder',
'idproduk',
'qty',
'tgldiminta',
'keterangan',
],
]);
?>
<div class="panel panel-default">
<div class="panel-heading">
<h4>
<i class="glyphicon glyphicon-envelope"></i> Product on database
<button type="button" class="add-item btn btn-success btn-sm pull-right"><i class="glyphicon glyphicon-plus"></i> Add</button>
</h4>
</div>
<div class="panel-body">
<div class="container-items"><!-- widgetBody -->
<?php foreach ($modelItems as $i => $modelItem): ?>
<div class="item panel panel-default"><!-- widgetItem -->
<div class="panel-heading">
<h3 class="panel-title pull-left">Items</h3>
<div class="pull-right">
<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 (! $modelItem->isNewRecord) {
echo Html::activeHiddenInput($modelItem, "[{$i}]id");
}
?>
<div class="row">
<div class="col-md-2">
<?php echo Html::img('../media/upload/noimagefound.jpg', [
'class' => 'pull-left img-responsive',
'style' => [
'height'=>'100px',
'margin-left'=>'20px'
]
]); ?>
</div>
<div class="col-md-10">
<div class="row">
<div class="col-md-3">
<?php
echo $form->field($modelItem, "[{$i}]idproduk", [
'horizontalCssClasses' => [
'wrapper' => 'col-sm-12'
]
])->widget(Select2::classname(), [
'data' => ArrayHelper::map(Produk::find()->all(), 'id', 'kodeproduk'),
'options' => ['placeholder' => 'Select a product ...'],
'pluginOptions' => [
'allowClear' => true,
// 'width' => 160
],
]);
?>
</div>
<div class="col-md-1">
<?= $form->field($modelItem, "[{$i}]qty", [
'horizontalCssClasses' => [
'wrapper' => 'col-sm-12'
]
])->textInput([
'maxlength' => true]) ?>
</div>
<div class="col-md-3">
<?php
echo '<label>Tanggal diminta</label>';
echo DatePicker::widget([
'name' => 'Orderitems[{$i}][tgldiminta]',
'value' => date('d-M-Y', strtotime('+2 days')),
'options' => ['placeholder' => 'Select issue date ...'],
'pluginOptions' => [
'format' => 'dd-mm-yyyy',
'todayHighlight' => true
]
]);
?>
</div>
<div class="col-md-5">
<?= $form->field($modelItem, "[{$i}]keterangan", [
'horizontalCssClasses' => [
'wrapper' => 'col-sm-12'
]
])->textInput([
'maxlength' => true]) ?>
</div>
</div>
</div>
</div>
</div>
</div>
<?php endforeach; ?>
</div>
</div>
</div><!-- .panel -->
<?php DynamicFormWidget::end(); ?>
<div class="form-group">
<?= Html::submitButton($model->isNewRecord ? 'Create' : 'Update', ['class' => $model->isNewRecord ? 'btn btn-success' : 'btn btn-primary']) ?>
</div>
<?php ActiveForm::end(); ?>
Based on your example, "jQuery(this).html("Produit: " + (index + 1));" what is Produit? is it select2 name controller on my code?$ "Produit" is just a string; the box title of the new item. It has no effect.
Try to remove \yii\web\View::POS_END from the end of this function.
$this->registerJs(<<<JS
$(".dynamicform_wrapper").on('afterInsert', function(e, item) {
var datePickers = $(this).find('[data-krajee-kvdatepicker]');
datePickers.each(function(index, el) {
$(this).parent().removeData().kvDatepicker('remove');
$(this).parent().kvDatepicker(eval($(this).attr('data-krajee-kvdatepicker')));
});
var last_index = -1;
$(".dynamicform_wrapper").on("afterInsert", function(e, item) {
$(this).html("Produit: " + (index + 1));
last_index= index;
});
kvListenEvent("select2:select", $("#orderitems-"+last_index+"-idproduk").kvSelector(),
function() {
console.log('test');
});
});
JS
, \yii\web\View::POS_END);
i have remove \yii\web\View::POS_END but still got "kvListenEvent is not defined". Im new using Yii2, please help.
Thanks.
i have remove \yii\web\View::POS_END but still got "kvListenEvent is not defined". Im new using Yii2, please help.
Thanks. hi can you post the code? tks a lot
