michael86
(Michaelcarvalho86)
July 4, 2016, 12:45pm
1
Hi,
I’m trying to call one modal:
$('._addNew').click(function(event){
$('#modalal').modal('show')
.find('#modalAddParam2')
.load($(this).attr('value'))
});
with multiple buttons. This buttons are created automatically inside of the Gridview. The number of elements in the grid is always different, so the number of buttons is always different to.
This is how I call my js script in the gridview:
<tr>
<td><?= Html::button('+ New Param', ['value'=>Url::to(['parameter/add','id'=>$model->id]),'class' => 'btn btn-primary btn-sm _addNew']);?></td>
<?php
Modal::begin([
'header'=> '<h4>New Param<h4>',
'id' => 'modalal',
//'class' =>'modalal',
'size' => 'modal-md-6',
'clientOptions' => ['backdrop' => 'static', 'keyboard' => FALSE],
]);
echo "<div id='modalAddParam2'></div>";
Modal::end();
?>
</tr>
I know that the class must be the same for buttons, but when I create a class in the Modal widget, that doesn’t work!!
With the id, the Modal only works for the first button of the gridview.
Someone has already done something similar before?
Thanks a lot
alirz23
(Ali Raza)
July 4, 2016, 1:29pm
2
okay you don’t need a class on the modal ID will do it, do you generate modal for each row in the gridview?
alirz23
(Ali Raza)
July 4, 2016, 1:30pm
3
or is it just one modal on the page
michael86
(Michaelcarvalho86)
July 4, 2016, 1:39pm
4
Thanks a lot for your answer
for each row I generate the code above, and I call that js script
alirz23
(Ali Raza)
July 4, 2016, 2:08pm
5
yea that won’t work, try this
$('._addNew').click(function(event){
var modalId = $(this).data("modal");
$('#' + modalId).modal('show')
.find('#modalAddParam2')
.load($(this).attr('value'))
});
<tr>
<td>
<?= Html::button('+ New Param', ['value' => Url::to(['parameter/add', 'id' => $model->id]), 'class' => 'btn btn-primary btn-sm _addNew', 'data-modal' => 'modalal-'.$model->id]); ?>
</td>
<?php
Modal::begin([
'header'=> '<h4>New Param<h4>',
'id' => 'modalal-'.$model->id,
'size' => 'modal-md-6',
'clientOptions' => ['backdrop' => 'static', 'keyboard' => FALSE],
]);
echo "<div id='modalAddParam2'></div>";
Modal::end();
?>
</tr>
michael86
(Michaelcarvalho86)
July 5, 2016, 6:16am
6
alirz23:
yea that won’t work, try this
$('._addNew').click(function(event){
var modalId = $(this).data("modal");
$('#' + modalId).modal('show')
.find('#modalAddParam2')
.load($(this).attr('value'))
});
<tr>
<td>
<?= Html::button('+ New Param', ['value' => Url::to(['parameter/add', 'id' => $model->id]), 'class' => 'btn btn-primary btn-sm _addNew', 'data-modal' => 'modalal-'.$model->id]); ?>
</td>
<?php
Modal::begin([
'header'=> '<h4>New Param<h4>',
'id' => 'modalal-'.$model->id,
'size' => 'modal-md-6',
'clientOptions' => ['backdrop' => 'static', 'keyboard' => FALSE],
]);
echo "<div id='modalAddParam2'></div>";
Modal::end();
?>
</tr>
That works now =)
Thank you very much alirz23.