I use yii2 and bootstrap4 for it ( https://github.com/yiisoft/yii2-bootstrap4 )

I registered in a layout

<?php Modal::begin(['id'=>'simple-modal', 'size'=>'modal-lg']); Modal::end(); ?> 

If somewhere in the code to write a link with data-* attributes such as -toggle and -toggle , then this modal window will be called

 <a class="btn btn-success" href="/user/create" data-toggle="modal" data-target="#simple-modal">Создать</a> 

Question: Is it possible to specify the href attribute in a simple, exactly in the same style, so that when you click, the query will automatically go away in a given way? Or it is not possible and you should always do this:

 $('#wrapper').on('click', '.modal-action', function () { $('#simlple-modal') .find('#modal-content') .load($(this).attr('href')); }); ) $('#wrapper').on('click', '.modal-action', function () { $('#simlple-modal') .find('#modal-content') .load($(this).attr('href')); }); ) $('#wrapper').on('click', '.modal-action', function () { $('#simlple-modal') .find('#modal-content') .load($(this).attr('href')); }); 

??

    2 answers 2

    The bootstrap has events like show.bs.modal. After opening the modal, you can get data from the element that initiated the opening, etc. If we use the link to open a modalk, then there is no point in writing an address in the href, you can do this.

     <a class="btn btn-success" href="#simple-modal" data-toggle="modal" data-url="/user/create">Создать</a> 

    Event opening modalki

     $('.modal').on('show.bs.modal', function (event) { let modal = $(this); let button = $(event.relatedTarget); let url = button.data('url'); // грузим ресурс по адресу }); 

    So you do not have to cling to the click event on the container, which saves a little resource.

    • Yes, in some ways there is a sense, although in general it turns out what I described at the end of my post. We need to think - Sergey Mishin

    Actually two options:

     <?= Html::a('Создать', 'javascript:void(0);', [ 'data-toggle' => 'modal', 'data-target' => '#simple-modal', ]); ?> <?= Html::button('Создать', [ 'data-toggle' => 'modal', 'data-target' => '#simple-modal', ]); ?> 
    • You did not understand the question. The point is not how to open the modalka (this is written in my question), but how to automatically pull up the data specified in the modalki attribute - Sergey Mishin