После вызова Ajax таблица данных не может перезагрузиться
После успешного вызова Ajax я хочу перезагрузить мою таблицу начальной загрузки с новыми значениями, которые возвращаются из моей части php.
<table id="gelirtableid" data-toggle="table" data-url="gelir-getdata.php" data-classes="table table-hover" data-striped="true"data-pagination="true" data-page-list=[20, 40, 75, 100] data-search="true">
<thead>
<tr >
<th data-sortable="true" data-field="tarih">Tarih</th>
<th data-sortable="true" data-field="Toplam">Toplam</th>
</tr>
</thead>
</table>
мой PHP-скрипт, который извлекает данные из MySQL
<?php
include "dbcon.php";
if($_POST["gelirtablosecimi"]){
$gelirtabloadi = $_POST["gelirtablosecimi"];
$_SESSION["gelirtabloadi"] = $gelirtabloadi;
}
$gelirtabloadi = $_SESSION["gelirtabloadi"];
$gelirgunluktoplam = $db->prepare("select tarih, hasilat + visa + butce_ici + hisse_satis + sosyal_konut + elektrik + haberlesme + iller_bank + diger AS Toplam from $gelirtabloadi");
$gelirgunluktoplam->execute();
$results = $gelirgunluktoplam->fetchAll(PDO::FETCH_ASSOC);
$json = json_encode($results);
echo $json;
?>
и мой вызов Ajax
$("#gelirgetir").click(function() {
var gelirtablosecimi = $("#select1").val();
if (gelirtablosecimi) {
$.ajax({
type: "POST",
url: "gelir-getdata.php",
data: {
"gelirtablosecimi": gelirtablosecimi
},
success: function(result) {
notifyUser('success', 'Başarılı!', 'Tablo başarıyla güncellendi');
location.reload();
},
error: function(result) {
notifyUser('error', 'Hata', 'error');
}
});
} else {
notifyUser('info', 'Dikkat', 'Tablo seçimi yapmadınız!');
}
});
Я новичок в вызовах Ajax, возможно, проблема в моей части Ajax.
Как видите, я имею дело с location.reload(); после успешного вызова. Я пытался перезагрузить .container а также #gelirtableid но у меня ничего не получалось. В основном, когда я нажимаю #gelirgetir Кнопка, он обновляет одно из моих значений сеанса, и моя таблица зависит от этого значения сеанса. После изменения значения сеанса и после перезагрузки страницы появляются новые значения, но мне приходится принудительно обновлять страницу. Я только хочу обновить стол. Любое предложение?
Решение
Замените код вашей таблицы, чтобы у вас было тело таблицы. Мы собираемся заменить это позже.
<table id="gelirtableid" data-toggle="table" data-url="gelir-getdata.php" data-classes="table table-hover"data-striped="true"data-pagination="true" data-page-list=[20, 40, 75, 100] data-search="true">
<thead>
<tr>
<th data-sortable="true" data-field="tarih">Tarih</th>
<th data-sortable="true" data-field="Toplam">Toplam</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
В вашей функции вам нужно извлечь данные из ответа через функцию parseJSON в jQuery. Затем вам нужно создать контент для тела таблицы. Вот пример.
$("#gelirgetir").click(function () {
var gelirtablosecimi = $("#select1").val();
if (gelirtablosecimi) {
$.ajax({
type: "POST",
url: "gelir-getdata.php",
data: {
"gelirtablosecimi": gelirtablosecimi
},
success: function (result) {
notifyUser('success', 'Başarılı!', 'Tablo başarıyla güncellendi');
var content = '';
$.each(result, function(i, data) {
content += '<tr>';
content += '<td>'+result[i].tarih+'</td>';
content += '<td>'+result[i].Toplam+'</td>';
content += '</tr>';
});
$('#gelirtableid tbody').html(content);
},
error: function (result) {
notifyUser('error', 'Hata', 'error');
}
});
} else {
notifyUser('info', 'Dikkat', 'Tablo seçimi yapmadınız!');
}
});
Другие решения
Ошибка, когда я получаю сверху решение о JSON.parse(), $.each ожидает разбора данных JSON. Следующие коды работают как шарм.
<table id="gelirtableid" data-toggle="table" data-url="gelir-getdata.php" data-classes="table table-hover" data-striped="true"data-pagination="true" data-page-list=[20, 40, 75, 100] data-search="true">
<thead>
<tr >
<th data-sortable="true" data-field="tarih">Tarih</th>
<th data-sortable="true" data-field="Toplam">Toplam</th>
</tr>
</thead>
</table>
Ajax Call:
$("#gelirgetir").click(function() {
var gelirtablosecimi = $("#select1").val();
if (gelirtablosecimi) {
$.ajax({
type: "POST",
url: "gelir-getdata.php",
data: {
"gelirtablosecimi": gelirtablosecimi
},
success: function(result) {
var content = '';
var obj = JSON.parse(result);
$.each(obj, function(i, data) {
content += '<tr>';
content += '<td>'+obj[i].tarih+'</td>';
content += '<td>'+obj[i].Toplam+'</td>';
content += '</tr>';
});
$('#gelirtableid tbody').html(content);
notifyUser('success', 'Başarılı!', 'Tablo başarıyla güncellendi');
},
error: function(result) {
notifyUser('error', 'Hata', 'error');
}
});
} else {
notifyUser('info', 'Dikkat', 'Tablo seçimi yapmadınız!');
}
});