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

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


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

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

через 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 - 16 октября 2018 13:20 -

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

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

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

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

progressive
Юзер

progressive - 16 октября 2018 13:26 -

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

Flash
Юзер

Flash - 16 октября 2018 18:54 -

Под каждым "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 - 18 октября 2018 03:59 -

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

Flash
Юзер

Flash - 18 октября 2018 09:13 -


<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 - 19 октября 2018 03:01 -

Спасибо

progressive
Юзер

progressive - 19 октября 2018 03:12 -

<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 - 19 октября 2018 03:26 -

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

Flash
Юзер

Flash - 19 октября 2018 09:11 -

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

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

Flash
Юзер

Flash - 19 октября 2018 10:07 -

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

progressive
Юзер

progressive - 20 октября 2018 04:05 -

Мой 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 - 20 октября 2018 08:46 -

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

progressive
Юзер

progressive - 20 октября 2018 10:04 -

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

Flash
Юзер

Flash - 19 октября 2018 08:55 -

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

Flash
Юзер

Flash - 16 октября 2018 18:59 -

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

Чтобы комментировать - войдите или зарегистрируйтесь на сайте

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

наверх