Не нравятся результаты поиска? Попробуйте другой поиск!

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

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

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

вопрос

Привет всем!

через 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 комментариев

Эксперт

247

Flash - 2018-08-0216 октября 2018 13:20 - #69563

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

Вместо

limit="100"

надо

limit="15"

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

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

Бесплатные шаблоны

Юзер

173

progressive - 2018-08-0216 октября 2018 13:26 - #69565

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

Эксперт

247

Flash - 2018-08-0216 октября 2018 18:54 - #69568

Под каждым "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>

Бесплатные шаблоны

Юзер

173

progressive - 2018-08-0218 октября 2018 03:59 - #69587

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

Эксперт

247

Flash - 2018-08-0218 октября 2018 09:13 - #69589


<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>

Бесплатные шаблоны

Юзер

173

progressive - 2018-08-0219 октября 2018 03:01 - #69613

Спасибо

Юзер

173

progressive - 2018-08-0219 октября 2018 03:12 - #69614

<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();
});

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

Юзер

173

progressive - 2018-08-0219 октября 2018 03:26 - #69615

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

Эксперт

247

Flash - 2018-08-0219 октября 2018 09:11 - #69618

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

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

Бесплатные шаблоны

Эксперт

247

Flash - 2018-08-0219 октября 2018 10:07 - #69619

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

Бесплатные шаблоны

Юзер

173

progressive - 2018-08-0220 октября 2018 04:05 - #69628

Мой 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">
Все равно отображается, что то упустил?

Эксперт

247

Flash - 2018-08-0220 октября 2018 08:46 - #69629

Надо