Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 17.03.2017, 11:24
Аспирант
Отправить личное сообщение для slavAAvals Посмотреть профиль Найти все сообщения от slavAAvals
 
Регистрация: 08.12.2016
Сообщений: 49

Фильтр на "чистом" javascript
Имеется сайт:
http://paqura616.h1n.ru/mypoems.php

Подгружаются данные из базы данных

<div class="poems-list" >
		<?php
	     	while( ($row = mysqli_fetch_assoc($result)) ) {
				echo '<div class="poems-list__item">';
				echo '<h2 class="poems-title">' . $row['title'] . '</h2>';
				echo '<p class="poems-content">' . $row['text'] . '</p>';
				echo '<span class="poems-date">' . $row['date'] . '</span>';
				echo '</div>';
			}
		?>
	</div>


Вопрос: как отфильтровать входящие данные по автору/дате и т.д.

Важен даже не сам конкретный пример, а общая реализация таких фильтров.
По теме совсем ничего нет конкретного в поиске. Абсолютное большинство найденных ответов - ворпрессовские фильтры, jquery и т.д.
Ответить с цитированием
  #2 (permalink)  
Старый 17.03.2017, 11:45
Аватар для Alexandroppolus
Профессор
Отправить личное сообщение для Alexandroppolus Посмотреть профиль Найти все сообщения от Alexandroppolus
 
Регистрация: 25.10.2016
Сообщений: 1,012

на js недавно фильтровали
Фильтр по таблице, определенного слова
Ответить с цитированием
  #3 (permalink)  
Старый 17.03.2017, 12:14
Аспирант
Отправить личное сообщение для slavAAvals Посмотреть профиль Найти все сообщения от slavAAvals
 
Регистрация: 08.12.2016
Сообщений: 49

Я бы сказал, что это немного не то.
Это всё же больше поиск, чем фильтр.

Покажу абстрактный пример:

<select name="select-lang" id="lang" >
  <option value="rus">Русский</option>
  <option value="eng">Англ.</option>
  <option value="span">Испанский</option>
</select>

<label for="verl">Верлибр</label>
<input type="checkbox" id="verl"/>

<label for="novel">Проза</label>
<input type="checkbox" id="novel"/>

<label for="poem">Стишок</label>
<input type="checkbox" id="poem"/>


Как на основе этого оставлять выбранные пункты?

Последний раз редактировалось slavAAvals, 17.03.2017 в 12:19.
Ответить с цитированием
  #4 (permalink)  
Старый 17.03.2017, 12:20
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,108

slavAAvals,
Ответить с цитированием
  #5 (permalink)  
Старый 17.03.2017, 12:23
Аспирант
Отправить личное сообщение для slavAAvals Посмотреть профиль Найти все сообщения от slavAAvals
 
Регистрация: 08.12.2016
Сообщений: 49

Я неправильно задаю вопросы, да?)

Или использую не те инструменты для реализации?
Ответить с цитированием
  #6 (permalink)  
Старый 17.03.2017, 12:47
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,108

slavAAvals,
недостаточно информации, что фильтровать, html блоки c rus poem -- как они связаны с фильтрами классами или дата- атрибуты
Ответить с цитированием
  #7 (permalink)  
Старый 17.03.2017, 12:51
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,108

Сообщение от slavAAvals
общая реализация таких фильтров
идти циклом по блокам и проверять условие для показа или скрытия
Ответить с цитированием
  #8 (permalink)  
Старый 17.03.2017, 13:07
Аспирант
Отправить личное сообщение для slavAAvals Посмотреть профиль Найти все сообщения от slavAAvals
 
Регистрация: 08.12.2016
Сообщений: 49

Я просто никогда не имел дело с такими вещами, честно говоря. Решил разобраться наконец.
И пока что не понимаю, возможно, самых глупых и банальных вещей.
Попробуй ещё раз объяснить

<div class="poems-list" >
		<?php
	     	while( ($row = mysqli_fetch_assoc($result)) ) {
				echo '<div class="poems-list__item">';
				echo '<h2 class="poems-title">' . $row['title'] . '</h2>';
				echo '<p class="poems-content">' . $row['text'] . '</p>';
				echo '<span class="poems-date">' . $row['date'] . '</span>';
				echo '</div>';
			}
		?>
</div>


Это то, что генерируется на странице.
Получается длинный список, удлиняющийся со временем.
Я хочу привязаться (вот тут первый вопрос: как?) к этим данным с помощью фильтра.

// Тут я имею ввиду, что текст будут на разных языках и чтобы при выборе одно из элементов в списке, те, что не имеют данного свойства удалялись из дома или прятались
<select name="select-lang" id="lang" >
  <option value="rus">Русский</option>
  <option value="eng">Англ.</option>
  <option value="span">Испанский</option>
</select>

// так же тут
<label for="verl">Верлибр</label>
<input type="checkbox" id="verl"/>

<label for="novel">Проза</label>
<input type="checkbox" id="novel"/>

<label for="poem">Стишок</label>
<input type="checkbox" id="poem"/>



Надо для начала к .poems-list__item добавлять атрибут rus, например или как это делается...
Ответить с цитированием
  #9 (permalink)  
Старый 17.03.2017, 13:17
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,108

slavAAvals,
как вам удобнее
<div data-lang="rus" data-category="poem"></div>
<div class="rus poem"></div>
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Сортировка DIV на "чистом" JavaScript Feuerman063 Элементы интерфейса 31 21.10.2015 13:03
Существует ли скрипт слайдера цены на "чистом" Javascript? Allality Общие вопросы Javascript 10 11.08.2012 00:49
нужно сделать фильтр при помощи javascript. vladi_09 jQuery 1 30.09.2011 18:36
Последние книги по JavaScript! monolithed Учебные материалы 7 26.10.2010 19:40
Выдвет ошибку JavaScript Ромио Opera, Safari и др. 4 21.10.2010 20:34