Обработка строки с использованием DataTable и JavaScript. Создание таблицы из MySQL с переменными столбцами в WordPress ⇐ Jquery

[Anonymous]

Я пытаюсь генерировать динамическую таблицу в WordPress, используя DataTables и шорткод. Консоль не показывает ошибок и отображает ответ Ajax. Таблица заполняется данными, но все еще написана «Обработка»
Введите описание изображения здесь < /p>
Я ищу решение моей проблемы. Ajax:
введите описание изображения здесь
my js file < /p>
jQuery(document).ready(function($) {
$("#my-dynamic-table").DataTable({
"processing": true,
"serverSide": false,
"ajax": {
"url": my_plugin_ajax.ajax_url, // Ajax URL WordPressa
"type": "POST",
"dataType": "json", // Określenie, że dane zwracane z serwera będą w formacie JSON
"data": function(d) {
d.action = 'get_new_data';
d.imie = my_plugin_ajax.imie; //$('#my-dynamic-table').data('id');
d.nazwisko = my_plugin_ajax.nazwisko; //$('#my-dynamic-table').data('name');
//d.city = $('#my-dynamic-table').data('city');
},
"error": function(xhr, status, error) {
console.error('AJAX Error:', status, error);
$('#table-body').html('
Error loading data. Status: ' + status + ', Error: ' + error + '
');
},
"success": function(response) {
// Funkcja success - działa, gdy dane zostały załadowane
if (response.success) {
console.log('Dane:', response.data);
console.log('Czy Tablica:',Array.isArray(response.data));
//////////////////////////
var tableBody = $('#table-body'); // Ciało tabeli
tableBody.empty(); // Wyczyść poprzednie dane
// Wyświetlamy dane w tabeli
response.data.forEach(function(item) {

//$('#table-body').empty(); // Czyszczenie poprzednich danych
// Dodaj nowe dane do tabeli - stale parametry
var row = $('');
row.append('' + item.id + '');

// Dodanie dynamicznych kolumn
if (item.imie) {
row.append('' + item.imie + '');
}
if (item.nazwisko) {
row.append('' + item.nazwisko + '');
}

row.append('' + item.czas + '');
row.append('');

tableBody.append(row);
});
//////////////////////////
} else {
alert("Brak danych do wyświetlenia.");
}
}
},
"paging": true,
"ordering": true,
"info": true,
});

// Automatyczne odświeżanie tabeli co 5 sekund
setInterval(function() {
$('#my-dynamic-table').DataTable().ajax.reload();
}, 5000); // Odśwież co 5 sekund

});
< /code>
Я был бы благодарен за ваши советы < /p>
Редактировать:
Вот как он строит таблицу < /p>
function topChrono_wyswietl_tabele_wynikow($atts){
/// Dynamiczne argumenty, ktore chcemy pobrac z bazy danych
/// Ustalamy domyślne wartości dla parametrów
$atts = shortcode_atts( // nadanie domyślnych wartosci atrybutow
array(
'imie' => '0', // czy chce wyswietlac miasto
'nazwisko' => '0', // czy chce wyswietlac klub
),
$atts,
'tabela_wynikow'
);

// Generowanie nagłówków tabeli
$output = '';
$output .= '';
$output .= 'Id';

// Dodajemy dynamiczne kolumny na podstawie wartości 'name'
if ($atts['imie'] === '1') {
$output .= 'Imie';
}
if ($atts['Nazwisko'] === '1') {
$output .= 'Nazwisko';
}
// if ($atts['city'] == '1') {
// $output .= 'Dynamic';
// }

$output .= 'Czas';
$output .= '';

// Generowanie ciała tabeli - AJAX
$output .= '';
$output .= '';

////////// Załaduj nasz skrypt AJAX/////////////////////////////////////
//ustalamy odpowiedni protokół
$protocol = isset($_SERVER['HTTPS']) ? 'https://' : 'http://';
//pobieramy adres do pliku admin-ajax.php
$admin_ajax_url = admin_url( 'admin-ajax.php', $protocol );
//za pomocą tej funkcji przekazujemy zmienną zawierająca adres, do javascript
wp_localize_script( 'main-js', 'my_plugin_ajax', array(
'miasto' => $atts['miasto'],
'klub' => $atts['klub'],
'city' => $atts['city'],
'ajax_url' => $admin_ajax_url,'nonce' => wp_create_nonce( 'my_nonce') ) );
//////////////////////////////////////////////////////////////////////////
return $output;
}
< /code>
Что я получаю данные: < /p>
function my_plugin_get_new_data() {
// Otrzymywanie danych z AJAX

$imie = intval($_POST['imie']);
$nazwisko = intval($_POST['nazwisko']);

// Liczba rekordów na stronę (paginacja)
$limit = isset($_POST['length']) ? intval($_POST['length']) : 10;
$offset = isset($_POST['start']) ? intval($_POST['start']) : 0;
// Wyszukiwanie (jeśli istnieje)

// Zapytanie do bazy danych MySQL, aby pobrać nowe dane (dostosuj zapytanie do swojej struktury)
global $wpdb;
$table_name = $wpdb->prefix . 'topchrono_liveresults_table';

$query = "SELECT id";
// Dodanie dynamicznych kolumn w zależności od przekazanych wartości
if ($imie === 1) {
$query .= ", imie";
}
if ($nazwisko === 1) {
$query .= ", nazwisko";
}
// if (strpos($columns, 'dynamic3') !== false) {
// $query .= ", dynamic3";
// }

$query .= " , czas"; //
$query .= " FROM $table_name "; //
// $query .= " LIMIT $limit OFFSET $offset";
//

$results = $wpdb->get_results($query); // tablica z wynikami

// Liczba wszystkich rekordów w tabeli
//$total_records = $wpdb->get_var("SELECT COUNT(*) FROM $table_name");

// Sprawdzenie, czy są dane
if ($results) {
// Zwracamy dane w formacie JSON
wp_send_json_success( $results );
} else {
wp_send_json_error('No data found');
}
wp_die(); // Zakończenie skryptu
}
< /code>
в консоли я вижу: < /p>
Array(3) [ {…}, {…}, {…} ]
​
0: Object { id: "800", imie: "Johan", nazwisko: "S", … }
​​
czas: "00:00:01"
​​
id: "800"
​​
imie: "Johan"
​​
nazwisko: "S"
​​
: Object { … }
​
1: Object { id: "801", imie: "Donald", nazwisko: "S", … }
​
2: Object { id: "802", imie: "Imie Auto Refresh", nazwisko: "Nazwisko Auto Refresh", … }
​
length: 3


Подробнее здесь: https://stackoverflow.com/questions/795 ... from-mysql