Технический сбой

Сайт временно работает в режиме только для чтения, идут восстановительные работы. Приносим свои извинения за неудобства.
DLE FAQ » Все вопросы » Шаблоны (TPL) » как сделать при нажатии кнопки вывод всех новостей?

как сделать при нажатии кнопки вывод всех новостей?


     Шаблоны (TPL), jQuery, Хаки    1311

вопрос
Привет всем!

через bootstrap tabs выведены новости на главной странице

Tab - Категория 1
{custom category="1,2,3" template="shortstory" order="title" sort="desc" limit="100"}

Tab - Категория 2
{custom category="4" template="shortstory" order="title" sort="desc" limit="100"}

Tab - Категория 3
{custom category="5" template="shortstory" order="title" sort="desc" limit="100"}


как сделать что бы 15 отображалось новостей в каждой категории,
а дальше показать что бы еще, при нажатии кнопки отображались все новости из назначенной категории?

Ответил: PunPun


В стол заказов.

15 комментариев

Flash
Эксперт

Flash - -

как сделать что бы 15 отображалось новостей в каждой категории

Вместо
limit="100"
надо
limit="15"

а дальше показать что бы еще, при нажатии кнопки отображались все новости из назначенной категории?

насколько я понял, можно просто ссылку на категорию вывести.

progressive
Юзер

progressive - -

Мне надо что бы снизу появлялись остальные новости, типо как продолжение отображения новостей

Flash
Эксперт

Flash - -

Под каждым "custom" добавить еще "custom", без параметра limit, но с параметром from. Каждый новый тег помещаем в скрытый div-контейнер, рядом кнопку для показа.
Пример для первой вкладки, нужна jquery

{custom category="1,2,3" template="shortstory" order="title" sort="desc" limit="15"}
<br />
<button onclick="$(this).next('div').show()">Показать все</button>
<div style="display:none">
{custom category="1,2,3" template="shortstory" order="title" sort="desc" from="15"}
</div>

progressive
Юзер

progressive - -

все нормально только кнопка остаётся как исправить?
как сделать что бы кнопка исчезала после показа всех новостей?

Flash
Эксперт

Flash - -


<button onclick="$(this).hide().next('div').show()">Показать все</button>
<div style="display:none">
{custom category="1,2,3" template="shortstory" order="title" sort="desc" from="15"}
</div>

progressive
Юзер

progressive - -

Спасибо

progressive
Юзер

progressive - -

<button data-show-ajax=".block">Показать все</button>
<div class="block" style="display:none">
{custom category="1,2,3" template="shortstory" order="title" sort="desc" from="15"}
</div>



$('[data-show-ajax]').on('click touch', function(event) {
  event.preventDefault();
  $($(this).attr('data-show-ajax')).show();
  $(this).hide();
});


сделал вот так! )) разница есть?

progressive
Юзер

progressive - -

Единственное что напрягает это то что если всего 12-14 новостей в категории
то кнопка все равно видна я как понял это не как не поправить? что бы если меньше 15 было новостей кнопки не видно было?

Flash
Эксперт

Flash - -

Можно считать количество новостей в блоке, например, с помощью класса элемента, который используется в шаблоне. Допустим, "custom" использует "shortstory.tpl" и там есть DIV с классом "itembox", тогда код для первой вкладки будет такой:

if ($("div.block1 .itembox").length < 15) {
	$("button[data-show-ajax='.block1']").hide();
}

Flash
Эксперт

Flash - -

Хотя немного неправильно описал, это же подсчитываются новости в скрытом блоке, а надо в видимом. Тогда видимый блок также оберните в DIV-контейнер с уникальным классом и через него действуйте. Или даже можно определять так, если в невидимом блоке нет новостей, соответственно, нечего и показывать - тогда и скрываем кнопку тоже.

progressive
Юзер

progressive - -

Мой JS:
$('[data-show-ajax]').on('click touch', function(event) {
  event.preventDefault();
  $($(this).attr('data-show-ajax')).show();
  $(this).hide();
});
if ($("div.block1 .block-cnt").length < 15) {
	$("button[data-show-ajax='.block1']").hide();
}


сделанный вариант:
<div class="block1"> {custom category="2" template="shortstory" order="date" sort="asc" limit="15"}</div>
<br />       
<button style="width: 100%;" data-show-ajax=".block">Показать все</button>
<div class="block" style="display:none">
{custom category="2" template="shortstory" order="title" sort="desc" from="15"}
</div>


shortstory обвернутый DIV-контенер: <div class="block-cnt">
Все равно отображается, что то упустил?

Flash
Эксперт

Flash - -

Надо
data-show-ajax=".block1"

progressive
Юзер

progressive - -

Спасибо! все работает!

Flash
Эксперт

Flash - -

Тогда надо, класс контейнера ("block") был разным для каждого "custom". Иначе, при клике на любую кнопку будут показаны все три блока.

Flash
Эксперт

Flash - -

Странно, я же все расписал в последнем сообщении, запостил как "ответ" вроде нет ошибок. Почему же мой ответ в "комментарии" перенесли?))

Похожие вопросы

наверх