@evgen9586
Изучаю Back-end программирование

Как сделать модальное окно на каждую кнопку?

Суть в чём.

Форичем выводятся вакансии у меня

Вид
<section id="inner-headline">
    <div class="container">

        <div class="row">
            <div class="col-lg-12">
                <h2 class="pageTitle">Вакансии</h2>
            </div>
        </div>
    </div>
</section>

<section id="content">
<div class="container">
    <?php foreach ($vac as $item) :?>
    <div class="panel">
        <div class="panel-heading">
            <h4 class="panel-title">
                    <i class="fa "></i><h3><?=$item['name']?></h3>

                    <i class="fa "></i><h4>Описание</h4>
                    <i class="fa "></i><?=$item['text']?>
                    <br>
                    <i class="fa "></i><h4>Требования</h4>
                    <i class="fa "></i><?=$item['requirements']?>
                    <br>
                    <i class="fa "></i><h4>Условия</h4>
                    <i class="fa "></i><?=$item['сonditions']?>

            </h4>

        </div>
        <a href="<?= \yii\helpers\Url::to(['vacancies/response', 'id' =>$item['id']])?>" type="button" data-id="<?=$item['id']?>" class="btn btn-success btn-default btnbaton" id="btnbaton">Отправить отклик</a>
        <?php
        \yii\bootstrap\Modal::begin(
            [
                'header' => '<h2> Отклик на вакансию </h2>',
                'id' => 'response',
                'footer' => '<button type = "button" class = "btn btn-default" data-dismiss = "modal">Закрыть</button>
<button type = "button" class = "btn btn-success">Отправить</button>'

            ]
        );
        \yii\bootstrap\Modal::end();


        ?>
    </div>
    <?php endforeach; ?>

</div>
</section>


Функционал описан так

function showCart(cart)
	{
		$('#response .modal-body').html(cart);
		$('#response').modal();
		
    }

    $('.btnbaton').on('click', function (e)
    {
        e.preventDefault();
        var id = $(this).data('id');

        $.ajax(
            {
                url:'index.php?r=vacancies/response',
                data: {id:id},
                type: 'GET',
                success: function (res) {
                    showCart(res);
                },
                error: function () {
                    alert('Error');
                }
            }
        );
    });


Суть в чём. В модальном окне будем форма для заполнения ,а эти данные опять аяксом полетят на сервер.

Но грубо говорят я всегда получаю одно и тоже модальное окно по клику любой кнопки. Меняется лишь параметр ответа , который приходит в зависимости от клика кнопки.

У модального окна в Yii есть хедер.

Так вот я хотел чтобы в хедере было название вакансии. Даже в цикл модальное окно запихнул. Чтобы оно создало модальные окна по названию вакансии. Но всё равно при клике в хедер попадает одна и та же вакансия
  • Вопрос задан
  • 71 просмотр
Решения вопроса 1
rework
@rework
Помог ответ? В благодарность отметь его решением
Во-первых, уберите в шаблоне модальное окно из цикла, что бы оно в одном экземпляре только оставалось. Во-вторых сделайте, что бы сервер присылал JSON, в котором отдельно будет тело (динамическое содержимое модального окна) и отдельно заголовок вакансии. Тогда в методе showCart вы сможете обновлять и заголовок и тело окна:

function showCart(cart) {
    $('#response .modal-title').html(cart.title);
    $('#response .modal-body').html(cart.body);
    $('#response').modal();
    ..........................
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через TM ID
Похожие вопросы
Max.Credit Санкт-Петербург
от 150 000 до 150 000 руб.
Willz Москва
от 150 000 руб.
Fmedia Санкт-Петербург
от 40 000 до 100 000 руб.
14 авг. 2018, в 18:01
12000 руб./за проект
14 авг. 2018, в 17:33
5000 руб./за проект
14 авг. 2018, в 16:33
1000 руб./за проект