Кнопка загрузить не скрывается
Здравствуйте! Проблема сЪела меня:) прошу помощи, вот скрипт, который по сути должен скрывать кнопку (ищё) если больше нечего подгружать, но не работает, что не так не понятно?
$(document).ready(function() {
// загружаем начальный блок
loadCatalog(0, 1);
// клик на кнопку "Еще"
$('#more').on('click', function() {
var showPage = $(this).data('show');
var preloadPage = parseInt(showPage) + 1;
loadCatalog(showPage, preloadPage);
});
});
function loadCatalog(showPage, preloadPage) {
// скрываем кнопку "Еще"
$('#more').hide();
// показываем блок с ранее загруженным контентом и прокручиваем к нему
if (showPage != 0) {
$('#page' + showPage).show('slow');
$('html,body').animate({ scrollTop: $('#page' + showPage).offset().top - 100 }, 1000);
}
// создаем блок под новую загрузку
$('#catalog').append('<div id="page' + preloadPage + '"></div>');
uri = uri + '?page=' + preloadPage;
// загружаем ajax-ом контент следующей страницы, но не показываем его
$.ajax({
url: uri,
cache: false,
success: function(html) {
if (html != '') {
$('#more').data('show', preloadPage);
$('#more').show();
$('#page' + preloadPage).hide();
$('#page' + preloadPage).html(html);
if (preloadPage == 1) loadCatalog(1, 2);
}
}
});
}
это сама кнопка <button class="btn btn-block btn-warning" id="more" data-show="0" style="display:none;">Еще</button> |
Цитата:
|
Цитата:
|
Цитата:
У вас сперва добавляется блок, а затем запрос, который еще не известно что вернет. |
Цитата:
Тамм всё это работает а у меня проблема, не могу понять где дапущенна ошибка? |
Цитата:
// создаем блок под новую загрузку $('#catalog').append('<div id="page' + preloadPage + '"></div>'); .... // загружаем ajax-ом контент следующей страницы, но не показываем его $.ajax({ .... success: function(html) { .... $('#page' + preloadPage).html(html); А должно быть $.ajax({ .... success: function(html) { if(html) { $('<div id="page' + preloadPage + '"/>').appendTo('#catalog').html(html); .... показываем кнопку и т.д.. } |
Цитата:
$(document).ready(function() {
// загружаем начальный блок
loadCatalog(0, 1);
// клик на кнопку "Еще"
$('#more').on('click', function() {
var showPage = $(this).data('show');
var preloadPage = parseInt(showPage) + 1;
loadCatalog(showPage, preloadPage);
});
// клик по кнопкам сортировки
$('.sort button').on('click', function() {
$('.sort button').removeClass('active');
$(this).addClass('active');
uri = setAttr('sortby', $(this).data('sort'));
uri = setAttr('sortdir', $(this).data('sortdir'));
$('#catalog').html('');
loadCatalog(0, 1);
return false;
});
// клик по кнопкам фильтра
$('.filter .filter-group button').on('click', function() {
var filter_group = $(this).parent('.filter-group');
var active = $(this).hasClass('active');
var filter = $(this).data('filter');
var value = '';
if (filter == 'category') { // категорий может быть выбрано несколько (checkbox)
$(this).toggleClass('active');
var categories = '';
$('.filter button[data-filter="category"].active').each(function() {
categories += $(this).data('value') + '|';
});
value = categories.substr(0, categories.length - 1);
}
else { // остальные фильтры (язык и формат) - только один вариант (radiobutton)
filter_group.find('button').removeClass('active');
if (!active) {
$(this).addClass('active');
value = $(this).data('value');
}
}
uri = setAttr(filter, value);
$('#catalog').html('');
loadCatalog(0, 1);
return false;
});
});
// скрываем кнопку "Еще"
function loadCatalog(showPage, preloadPage) {
$('#more').hide();
// показываем блок с ранее загруженным контентом и прокручиваем к нему
if (showPage != 0) {
$('#page' + showPage).show('slow');
$('html,body').animate({ scrollTop: $('#page' + showPage).offset().top - 100 }, 1000);
}
// создаем блок под новую загрузку
$('#catalog').append('<div id="page' + preloadPage + '"></div>');
uri = setAttr('page', preloadPage);
// загружаем контент следующей страницы, но не показываем его
$.ajax({
url: uri,
cache: false,
success: function(html) {
if (html != '') {
$('#more').data('show', preloadPage);
$('#more').show();
$('#page' + preloadPage).hide();
$('#page' + preloadPage).html(html);
if (preloadPage == 1) loadCatalog(1, 2);
}
}
});
}
// функция заменяет get-параметр в строке параметров uri (либо добавляет; либо удаляет, если передать val='')
function setAttr(prmName,val) {
var res = '';
var d = uri.split("?");
var base = d[0];
var query = d[1];
if(query) {
var params = query.split("&");
for(var i = 0; i < params.length; i++) {
var keyval = params[i].split("=");
if(keyval[0] != prmName) {
res += params[i] + '&';
}
}
}
if (val != '') res += prmName + '=' + val;
return base + '?' + res;
}
|
Цитата:
Ну сделали вы это - "создаем блок под новую загрузку", выполняете запрос и он завершился неудачей, а код ничего не анализирует. Пробуем еще раз, и опять "создаем блок под новую загрузку", и под ID дублирующем ID блока предыдущего неудачного запроса? setAttr(prmName,val) - эта химия вообще не нужна, а задержка ответа с пустой страницей при этом, затем анимация не очень то и радует. При этом клиент задает параметр сортировки ASC и DESC, да судя по именам и именами полей таблицы базы оперирует, знать бы еще как при этом поступает сервер. |
Цитата:
Выкинь свой говнокод и сделай как у людей. Вот ТЗ. 1. Создать контейнер под загрузку списка. 2. Создать переменную в которую сохранить длину всего списка. 3. Загрузить в этот контейнер часть списка. 4. Вычесть из общего количества полученное. 5. Если результат вычитания больше нуля, то гоу ту п.3. 6. Иначе скрыть кнопку "Еще". |
laimas, ответ сервера тебе ничего не даст. Ответ сервера поступает ПОСЛЕ нажатия на еще, а тебе ее надо скрыть ДО бесполезного ответа сервера. Следовательно надо знать ДО того как, будут ли еще данные или нет. Чтобы это знать, надо получить эти данные на этапе загрузки самой страницы. При этом, если на сервере общее количество может изменяться, то придется и его еще передавать каждый раз и обновлять значение той самой переменной.
Например ты вводишь по 10, а записей всего 8. Значит у тебя сразу же кнопки "еще" не должно быть. |
| Часовой пояс GMT +3, время: 18:36. |