Передавать динамические данные в модал начальной загрузки

Question

Передавать динамические данные в модал начальной загрузки

Я пытаюсь загрузить комментарии конкретного поста на модальном. Для этого мне нужно передать идентификатор сообщения модальной, а затем получить соответствующие комментарии.
Модал вызывается следующим:

<a class="xyz" data-toggle="modal" data-target="#compose-modal" data-id="<?php echo $list[$i]->getID(); ?>">View Comments</a>

И модал определяется внизу страницы следующим образом:

<div class="modal fade" id="compose-modal" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">

<!-- here i need to use php to fetch the comments using post id -->
</div>
</div>
</div>

1

jquery modal-dialog php

Решение

Другие решения

Просто передайте контент через ajax с php-страницей
и повторить содержание в модальном

0

Источник

Accepted Answer

PHP выполняется до того, как страница возвращается в браузер. Как только вы видите страницу в вашем браузере, весь PHP уже выполнен. Что вы, вероятно, хотите сделать, это использовать AJAX. Вот общий план того, как вы это сделаете:

Есть страница PHP, которая берет идентификатор и возвращает нужные данные в виде JSON.

api.php

   $theId = $_POST['theId'];

//Get the information you want, and turn it into an array called $data

header('Content-Type: application/json');
echo json_encode($data);

В вашем html вы должны запустить модальное окно, щелкнув на кнопке «Просмотреть комментарии»:

<a class="xyz" onclick = "launch_comment_modal(<?php echo $list[$i]->getID(); ?>)">View Comments</a>

затем внизу с другим вашим javascript:

   <script>
$('#compose-modal').modal({ show: false});

function launch_comment_modal(id){
$.ajax({
type: "POST",
url: "api.php",
data: {theId:id},
success: function(data){

//"data" contains a json with your info in it, representing the array you created in PHP. Use $(".modal-content").html() or something like that to put the content into the modal dynamically using jquery.

$('#compose-modal').modal("show");// this triggers your modal to display
},

});

}

</script>

5