Ребят, привет!
Опишу проблему сначала.
У меня есть на странице вот такой код:
<table class="last_payment">
<thead>
<tr>
<th>
Время
</th>
<th>
Сумма
</th>
<th>
Кто оказал помощь
</th>
</tr>
</thead>
<tbody>
<?php
if ($last_output_payments != FALSE)
{ //если нам вернулись данные, т.е. не равно FALSE. запускаем цикл и строим таблицу
foreach ($last_output_payments as $value) { ?>
<tr class="data_payments">
<td>
<?php echo date('H:i', $value['date_payment']); ?>
</td>
<td>
<?php echo $value['summa']; ?> <i class="fa fa-rub"></i>
</td>
<td>
<?php echo $value['kto_okazal_pomosh_name'] . " " . $value['kto_okazal_pomosh_last_name']; ?>
</td>
</tr>
<?php } //скобка от цикла foreach ?>
</tbody>
</table>
<!--Блок пагинации -->
<div class="pagination">
Сколько отображать элементов: <select name="count_last_payments_per_page" id="count_last_payments_per_page" onchange="add_new_payments()">
<option value="5">5</option>
<option value="10">10</option>
<option value="30">30</option>
<option value="50">50</option>
<option value="100">100</option>
</select>
</div>
<?php } //Скобка от условия if
дергаем вот эту функцию, но она у меня пустая, просто дальше не знаю куда двигаться
function add_new_payments()
{
//Получаем данные из выбранного селекта
var count_per_page = $('#count_last_payments_per_page').val();
alert(count_per_page);
}
//функция используется в ajax запросе в add_new_payments()
function add_new_elements(data)
{
}
На странице грузятся 5 элементов в таблицу. Мне необходимо при изменении селекта, т.е. человек выбирает например отобразить 10 элементов, отрисовать заново таблицу, без перезагрузки. Я чет туплю, пойдет вариант на jQuery, т.к. с Angular еще не работал. Подскажите пожалуйста как это реализовать, чет мыслей в голове нет, застопорился, хотя задача то не тривиальная. Буду благодарен за помощь! В гугле пытался искать, чет попадаются только связанные списки.
UPD Всех благодарю за помощь! :) Со всеми вопросами я справился!!! :)
Научился заполнять таблицу с помощью Ajax! :)
Вот такой функцией я перебираю массив и вставляю данные в таблицу:
function add_new_elements(data)
{
$( ".data_payments" ).remove();//удаляем строки в таблице с классом data_payments
$.each(data, function(key, val)
{ //запускаем цикл и перебираем его
output = "<tr class='data_payments'>";
output += "<td>";
output += val.date_payment;
output += "</td>";
output += "<td>";
output += val.summa;
output += "</td>";
output += "<td>";
output += val.kto_okazal_pomosh_name;
output += " ";
output += val.kto_okazal_pomosh_last_name;
output += "</td>";
output += "</tr>";
$( "#insert_count_per_page_last_payments" ).append(output);
});
}
Все теперь работает как часы! :) Методом тыка все же допер! :) Я слаб просто в jQuery и JS :( Но спасибо Андрею большое за ответы и наводки в какую сторону смотреть! :)
Простой
