Yii2 - Ввод значений при закрытии модальных - PullRequest
0 голосов
/ 29 марта 2019

на одной странице я рендеринг другой страницы с формой в bootstrap modal, когда заполнить ввод, если закрыть модальный (не отправить) только нажмите (x) будет возможно сохранить ввод значений при открытии модального снова?

index, php

<?= Html::a('<button class="btn btn-info">+</button>',['app/create'], ['id' => 'btn-add']) ?>


<?php
Modal::begin([
    'header' => '<div id="modal-title"></div>',
    'id' => 'modal',
    'size' => 'modal-lg',
    'clientOptions' => ['backdrop' => 'static', 'keyboard' => false],
]);
echo "<div id='modalContent'></div>";
Modal::end();
?>

.js

$('body').on('click', '#btn-add', function(e) {
     e.preventDefault();
         $('#modal').modal('show').find('#modalContent').load($(this).attr('href'));
    });

1 Ответ

1 голос
/ 29 марта 2019

Вы используете метод jquery .load() для загрузки формы внутри модального окна, и независимо от того, нажимаете ли вы кнопку закрытия модального окна или фон наложения, когда вы снова нажимаете кнопку +, вы снова загружаете содержимое внутри модальное окно.

Так что, если вы действительно хотите это сделать, вам придется переместить форму в то же представление, где у вас есть код Modal, это означает, что вам нужно будет добавить форму в строку и изменить javascript кнопки на $('#modal').modal('show'). , Должно быть как ниже

<?= Html::a('<button class="btn btn-info">+</button>','#', ['id' => 'btn-add']) ?>


<?php
Modal::begin([
    'header' => '<div id="modal-title"></div>',
    'id' => 'modal',
    'size' => 'modal-lg',
    'clientOptions' => ['backdrop' => 'static', 'keyboard' => false],
]);?>

<div id='modalContent'>
<?php
//your active form starts here 
    $form = ActiveForm::begin(
        [
            'id' => 'your-form-id',
            'action' => Url::to(['/controller/action'])

        ]
    );
?>
<?php
       ActiveForm::end();
?>
</div>

<?php Modal::end();
?>

и ваши Js должны быть просто

$('body').on('click', '#btn-add', function(e) {
    e.preventDefault();
    $('#modal').modal('show');
});
...