Доброго времени суток!
Подскажите пожалуйста, как с помощью AJAX реализовать обновление данных в таблице в wordpress, при выборе фильтров, без перезагрузки всей страницы?
Буду очень благодарен за бесценный опыт))
Пример кода:
global $historyTableDB;
$historyTableDB = new wpdb( $dbUser, $dbPassword, $coinHistoricalDB, $dbHost );
$tableName = coin_symbol . '_history_table';
$selectRange = $_REQUEST['range'] ?? 30;
$selectFrequency = $_REQUEST['frequency'] ?? 1;
$getHistoryTableDB = $historyTableDB->get_results( "SELECT * FROM $tableName ORDER BY id DESC LIMIT $selectRange" );
?>
<form class="historical__filters" action="<?= get_permalink(); ?>" method="post">
<label class="historical__filters_select">
<span>Time Period:</span>
<select class="historical__filters_range" name="range">
<option value="7" <?php if($selectRange == 7) {echo "selected";}?>>Week</option>
<option value="30" <?php if($selectRange == 30) {echo "selected";}?>>Month</option>
<option value="180" <?php if($selectRange == 180) {echo "selected";}?>>6 month</option>
<option value="360" <?php if($selectRange == 360) {echo "selected";}?>>Year</option>
<option value="9999" <?php if($selectRange == 9999) {echo "selected";}?>>All time</option>
</select>
</label>
<label class="historical__filters_select">
<span>Frequency:</span>
<select class="historical__filters_frequency" name="frequency">
<option value="1" <?php if($selectFrequency == 1) {echo "selected";}?>>Daily</option>
<option value="7" <?php if($selectFrequency == 7) {echo "selected";}?>>Weekly</option>
<option value="30" <?php if($selectFrequency == 30) {echo "selected";}?>>Monthly</option>
</select>
</label>
<input type="submit" class="historical__filters_apply" value="Apply">
<!-- <a class="historical__filters_apply download__link" href="#">Download</a>-->
</form>
<div class="overflow__container">
<input type="hidden" value="<?= $selectRange . ' - ' . $selectFrequency ?>">
<div class="historical__table_container">
<table id="historical__table" class="stripe row-border order-column default__table historical__table" style="width:100%">
<thead class="default__table_thead">
<tr>
<th>Date</th>
<th>Volume</th>
<th>High</th>
<th>Low</th>
<th>Open</th>
<th>Close</th>
<th>Change %</th>
</tr>
</thead>
<tbody class="default__table_tbody historical__table_tbody">
<?
$counter = 0;
foreach ( $getHistoryTableDB as $historyTableItem ) {
if ($counter%$selectFrequency != 0) {
$counter++;
continue;
}
$counter++;
$priceVolume = get_number_with_letters( $historyTableItem->table_price_volume);
$priceOpen = number_format( $historyTableItem->table_price_open, decimals );
$priceClose = number_format( $historyTableItem->table_price_close, decimals );
$priceHigh = number_format( $historyTableItem->table_price_high, decimals );
$priceLow = number_format( $historyTableItem->table_price_low, decimals );
$changesPCT = number_format( $historyTableItem->table_price_changes_pct, 2 );
if ( $counter === 30 ) {
break;
}
if ( $historyTableItem->table_price_open == 0 ) {
break;
}
$historyTableDate = $historyTableItem->table_date;
echo
"<tr>
<td>$historyTableDate</td>
<td>$priceVolume</td>
<td>$priceHigh</td>
<td>$priceLow</td>
<td>$priceOpen</td>
<td>$priceClose</td>
<td><span class=\"default__table_percent-change\">$changesPCT%</span></td>
</tr>";
$counter ++;
}
?>
</tbody>
</table>
</div>
</div>