Multiple modal popup

Hi,

I created a "Messages" controller and I am displaying in the GridView buttons to reply and read messages.

But I would like to display it in the popup window.

I did everything like in this video:

And it works fine, but only for one button.

How to do it for each button?

I tried to set .class instead #id but it nothing changed.

Popup.js:


$(function(){

	$('#ReplyButton').click(function (){

		$('#modal').modal('show')

		.find('#ModalContent')

		.load($(this).attr('value'));

	});

});

$(function(){

	$('#ReadButton').click(function (){

		$('#modal').modal('show')

		.find('#ModalContent')

		.load($(this).attr('value'));

	});

});




            [

			'label' => '',

			'format' => 'raw',

			'value' => function ($model) {                      

				return 	Html::button('<span class="glyphicon glyphicon-envelope">', 

				['value'=>Url::to('/panel/view&id='.$model->id), 'class'=>'btn btn-xs btn-success', 'id'=>'ReadButton', 'title'=>'Read']).' '.

				Html::button('<span class="glyphicon glyphicon-share-alt">', 

				['value'=>Url::to('/panel/create&id='.model->sender), 'class'=>'btn btn-xs btn-default', 'id'=>'ReplyButton', 'title'=>'Reply']);

			},

],

Hello

Maybe you forget add Modal Widget in your layout, try this




<?php 

use yii\bootstrap\Modal;


	//Modal

	Modal::begin([

	    'id' => 'modal',

	    'options' => [

	        'tabindex' => false,

	    ],

	    'size' => 'modal-lg',


	]);


		echo "<div id='modalContent'></div>";


	Modal::end();

?>



No, I added this module. It works but only for one ID

Change the click event ID to Class. This will work

JS File:


$(function(){

        $('.ReplyButton').click(function (){

                $('#modal').modal('show')

                .find('#ModalContent')

                .load($(this).attr('value'));

        });

});

$(function(){

        $('.ReadButton').click(function (){

                $('#modal').modal('show')

                .find('#ModalContent')

                .load($(this).attr('value'));

        });

});

PHP Code :


[

	'label' => '',

	'format' => 'raw',

	'value' => function ($model) {                      

		return  Html::button('<span class="glyphicon glyphicon-envelope">', ['value'=>Url::to('/panel/view&id='.$model->id), 'class'=>'btn btn-xs btn-success ReadButton', 'id'=>'ReadButton', 'title'=>'Read']).' '.

		Html::button('<span class="glyphicon glyphicon-share-alt">', ['value'=>Url::to('/panel/create&id='.model->sender), 'class'=>'btn btn-xs btn-default ReplyButton', 'id'=>'ReplyButton', 'title'=>'Reply']);

	},

],