Bootstrap модальное воссоздание без перезагрузки

Содержимое модального окна генерируется при загрузке страницы. Могу ли я восстановить содержимое этого модального окна с помощью JS без перезагрузки страницы?

Мое модальное окно:

<div class="modal-team-NtSubstitutePlayers modal fade" tabindex="-1" role="dialog">
            <div class="modal-dialog modal-lg" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                    </div>
                    <div class="modal-body">
                        <div class="list-of-players text-center">
                            <div class="list">
                                @foreach($team->players as $player)
                                    @if ($player->ntsubstitute && !$player->ntskipnextmatch)
                                        <a class="player_choose" id="player_id_substitute_{{$player->id}}">
                                            <div class="player">
                                                ....
                                            </div>
                                        </a>
                                    @endif
                                @endforeach
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

person Igor Ostapiuk    schedule 23.09.2017    source источник
comment
Используете ли вы модальные окна начальной загрузки? Добавьте HTML-код вашего модального окна.   -  person Thusitha    schedule 23.09.2017
comment
Да. Уже добавить.   -  person Igor Ostapiuk    schedule 23.09.2017
comment
Я имею в виду что-то вроде $('#modal-team-NtSubstitutePlayers').reload() или $('#modal-team-NtSubstitutePlayers').recreate()   -  person Igor Ostapiuk    schedule 23.09.2017


Ответы (1)


HTML Добавьте ID в модальное окно.

<div id="myModal" class="modal-team-NtSubstitutePlayers modal fade" tabindex="-1" role="dialog">
            <div class="modal-dialog modal-lg" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                    </div>
                    <div class="modal-body">
                        <div class="list-of-players text-center">
                            <div class="list">
                                @foreach($team->players as $player)
                                    @if ($player->ntsubstitute && !$player->ntskipnextmatch)
                                        <a class="player_choose" id="player_id_substitute_{{$player->id}}">
                                            <div class="player">
                                                ....
                                            </div>
                                        </a>
                                    @endif
                                @endforeach
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

JavaScript

//Show the modal
$("#myModal").modal("show");

//Reload the modal content
var modalHtml = $("#myModal").html();
$("#myModal").html("");
$("#myModal").html(modalHtml);

//Hide the modal
$("#myModal").modal("hide");
person Thusitha    schedule 23.09.2017
comment
Но я не хочу показывать или скрывать модальное окно. Я хочу перезагрузить содержимое модального окна без перезагрузки страницы. - person Igor Ostapiuk; 23.09.2017
comment
В этом случае вы должны динамически добавить код HTML из вашего кода JavaScript. Я вижу, вы визуализируете исходный HTML-код с сервера. - person Thusitha; 23.09.2017