Загрузка представления как модального всплывающего окна в CodeIgniter

Question

Загрузка представления как модального всплывающего окна в CodeIgniter

Я новичок в CodeIgniter, а также новичок в веб-приложении MVC. У меня проблема с отображением страницы php в модальном всплывающем окне.
Код ниже показывает первый вид.

<table id="tblTask" class="tblTasks">
<tr>
//I am showing my data here
</tr>
</table>

function addRowHandlers() {
var tables = document.getElementsByClassName("tblTasks");
[].forEach.call(tables, function (table) {
var rows = table.getElementsByTagName("tr");
for (i = 0; i < rows.length; i++) {
var currentRow = table.rows[i];
var createClickHandler =
function(row)
{
return function() {
//code to get parameter 1 and 2
window.location = "<?php echo base_url() . "tasks/getInfos/"; ?>" + parameter1 + "/" + parameter2;
};
};

currentRow.onclick = createClickHandler(currentRow);
}
});
}
window.onload = addRowHandlers();

Это представление 1, где у меня есть таблица, которая показывает мои данные, и сценарий используется для вызова контроллера при щелчке строки таблицы.

public function getInfos(parameter1, $parameter2){
$data['infos']  = $this->my_model->get_infos($parameter1, $parameter2);

$this->load->view('infos/information.php', $data);
}

Как я могу показать страницу info / infomation.php как модальное всплывающее окно в первом представлении (где контроллер был первоначально вызван). Я надеюсь, что кто-то поможет мне с этим.

Спасибо.

0

codeigniter modalpopup php

Решение

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

Других решений пока нет …

Источник

Accepted Answer

Вы должны использовать AJAX для этой цели. Вот пример кода.

<table id="tblTask" class="tblTasks">
<tr>
//I am showing my data here
</tr>
</table>

//Modal here
<div id="myModal" class="modal fade" role="dialog">
<div class="modal-dialog">

<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">&times;</button>
<h4 class="modal-title">Modal Header</h4>
</div>
<div class="modal-body" id="showdata">

</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>

</div>
</div>

function addRowHandlers() {
var tables = document.getElementsByClassName("tblTasks");
[].forEach.call(tables, function (table) {
var rows = table.getElementsByTagName("tr");
for (i = 0; i < rows.length; i++) {
var currentRow = table.rows[i];
var createClickHandler =
function(row)
{
return function() {
//code to get parameter 1 and 2
$.ajax({
type: "GET",
data: {parameter1: parameter1,parameter2 : parameter2},
url: <?php echo base_url() . "tasks/getInfos/",
success: function(data){
var d = $.parseJSON(data);
$.ajax({
type: "POST",
data: {data: d.data},
url: <?php echo base_url() . "infos/information.php",
success: function(info){
$("#showdata").html(info);
$("#myModal").modal("show");
},
});
}
});
};
};

currentRow.onclick = createClickHandler(currentRow);
}
});
}
window.onload = addRowHandlers();

В вашем контроллере

public function getInfos(parameter1, $parameter2){
$data['infos']  = $this->my_model->get_infos($parameter1, $parameter2);
echo  json_encode(array(data=>$data));
}

Таким образом, вам нужно сначала отправить запрос AJAX контроллеру для получения информации, затем вам нужно отправить второй запрос на страницу Info и получить от него ответ. Сохраните этот ответ в своем модальном теле как HTML и откройте модальное окно, используя $("#myModal").modal('show');

Надеюсь, теперь это ясно.

0