Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 16.02.2013, 16:25
Интересующийся
Отправить личное сообщение для Smip Посмотреть профиль Найти все сообщения от Smip
 
Регистрация: 23.01.2013
Сообщений: 19

filter(this,this) как правильно сделать?
Здравствуйте, есть таблица которые выводит какие-то данные, использую библиотеку table.js взято с этого сайта http://www.javascripttoolbox.com/lib/table/index.php , на умеет делать фильтрацию и сортировку, собственно что мне и нужно. В выборке есть 2 вида выбора это input и select. У меня задача стоит сделать поиск по столбику, указав максимальную цену, в документации к библиотеки есть пример как такое сделать через select как то вот так

<select style='width:70px' onchange="Table.filter(this,this)">
<option value="function(){return true;}">All</option>
<option value="function(val){return parseFloat(val.replace(/\$/,''))&lt;=300;}">&lt;= 300</option>
</select>


Меня интересует как можно сделать тоже самое через input, то есть пользователь пишет 1000, и в таблице выбираются значения которые <1000 , сейчас могу просто вставить инпут в который вводишь 1000 он находит элементы со значением 1000

<input onkeyup='Table.filter(this,this)'   size='6' name='filter'>

помогите, как такое сделать?
Ответить с цитированием
  #2 (permalink)  
Старый 16.02.2013, 18:14
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 26,830

Smip,
Ну как-то так ...
<!DOCTYPE HTML>
<html>
<head>
<script language="JavaScript" src="http://www.javascripttoolbox.com/libsource.php/table/source/table.js" type="text/javascript"></script>
  <title></title>
</head>
<body>
<table class="example">
<thead>
	<tr>
		<th colspan="5" >
		   Table filter<br>
		</th>
	</tr>
	<tr>
		<th>Index</th>
		<th>Numeric
<br /><input onkeyup='go(this)'   size='6' name='filter' value="300">
<script type="text/javascript">
function go(a)
{
   var v  = parseFloat(a.value)||1000;
   var f = {'filter': function(val){return parseFloat(val.replace(/\$/,''))<= v;}};
   Table.filter(a,f)
}
</script>
</th>
		<th>Text</th>
		<th>Currency</th>
		<th>Date</th>
	</tr>
</thead>
<tbody>
	<tr>
		<td>0</td>
		<td>860</td>
		<td>Bill</td>
		<td>$93.34</td>
		<td>2015-08-02</td>
	</tr>
	<tr>
		<td>1</td>
		<td>761.7</td>
		<td>Joe</td>
		<td>$30.04</td>
		<td>2013-10-26</td>
	</tr>
	<tr>
		<td>2</td>
		<td>436.2</td>
		<td>Bob</td>
		<td>$6.73</td>
		<td>2015-05-01</td>
	</tr>
	<tr>
		<td>3</td>
		<td>198.7</td>
		<td>Matt</td>
		<td>$11.34</td>
		<td>2014-07-12</td>
	</tr>
	<tr>
		<td>4</td>
		<td>600.3</td>
		<td>Mark</td>
		<td>$34.34</td>
		<td>2015-09-06</td>
	</tr>
	<tr>
		<td>5</td>
		<td>28.3</td>
		<td>Tom</td>
		<td>$47.34</td>
		<td>2015-02-02</td>
	</tr>
	<tr>
		<td>6</td>
		<td>779.6</td>
		<td>Jake</td>
		<td>$84.84</td>
		<td>2014-12-26</td>
	</tr>
	<tr>
		<td>7</td>
		<td>584.6</td>
		<td>Greg</td>
		<td>$67.34</td>
		<td>2013-11-13</td>
	</tr>
	<tr>
		<td>8</td>
		<td>745.2</td>
		<td>Adam</td>
		<td>$3.43</td>
		<td>2013-02-07</td>
	</tr>
	<tr>
		<td>9</td>
		<td>126</td>
		<td>Steve</td>
		<td>$87.64</td>
		<td>2015-01-24</td>
	</tr>
</tbody>
</table>


</body>

</html>
Ответить с цитированием
  #3 (permalink)  
Старый 16.02.2013, 19:18
Интересующийся
Отправить личное сообщение для Smip Посмотреть профиль Найти все сообщения от Smip
 
Регистрация: 23.01.2013
Сообщений: 19

Оууу.. спасибо Вам огромное, всё круто... только есть один нюанс, у меня в таблице иногда значения отсутствуют, и тогда такой поиск работает не верно. Первым делом я удалил с Вашего варианта value="300", когда страница загружается, всё хорошо. Когда пишу что-то в поле то тоже всё гуд, но когда я стираю всё к исходному значению, то пустые ячейки пропадают и никак их не вернуть... нужно как-то сделать чтобы все пустые ячейки по умолчанию удовлетворяли запрос, либо хотя бы сделать чтобы когда стираешь условия поиска, всё возвращалось на свои места. Я так понимаю надо колдовать над этой строчкой
var v  = parseFloat(a.value)||1000;

а пустые ячейки как-то так делаются у меня
<td></td>

И что я не пробовал писать, никак не находит, можно конечно их все забить 0, но эту таблицу смотрят очень тупые люди, и будут задавать лишние вопросы, почему там стоит 0, ведь цена 0 не может быть))

Последний раз редактировалось Smip, 16.02.2013 в 19:27.
Ответить с цитированием
  #4 (permalink)  
Старый 16.02.2013, 19:57
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 26,830

Smip,вариант если поле ввода пусто или начинается не с цифры фильтрации небудет
function go(a)
{
   var v  = parseFloat(a.value);
   var f = {'filter': function(val){
   if (!v) return true
   return parseFloat(val.replace(/\$/,''))<= v;}};
   Table.filter(a,f)
}

Последний раз редактировалось рони, 16.02.2013 в 20:01.
Ответить с цитированием
  #5 (permalink)  
Старый 16.02.2013, 20:50
Интересующийся
Отправить личное сообщение для Smip Посмотреть профиль Найти все сообщения от Smip
 
Регистрация: 23.01.2013
Сообщений: 19

Бомба! Всё работает так как и надо! Спасибо большое...
Ответить с цитированием
  #6 (permalink)  
Старый 23.02.2013, 01:07
Интересующийся
Отправить личное сообщение для Smip Посмотреть профиль Найти все сообщения от Smip
 
Регистрация: 23.01.2013
Сообщений: 19

Скажите, пожалуйста, а можно ли как-то сделать чтобы пустые ячейки тоже удовлетворяли условие поиска? просто суть проблемы в том что в таблице объявления, и иногда люди указывают цену, иногда нет. И когда клиенты делают поиск, то объявления без цены пропадают, хотя там много шансов что им подойдут, а из-за поиска они опускают остальные объявления из виду.
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как убрать hover? Либо как сделать стрелки статичными? krusty36 Элементы интерфейса 1 13.07.2011 08:20
как сделать выпадающий список, чтобы второй зависил от значения первого???? zsaz jQuery 2 16.07.2010 19:12
try и catch подскажите как правильно сделать Jekel Javascript под браузер 9 31.03.2010 09:33
Вопрос как сделать эту панельку Определённых размеров и свойств. jei jQuery 3 09.06.2009 18:14
Как сделать, чтобы 2 ссылки отображались как hover при наведении мышкой на любую? Ava Элементы интерфейса 5 19.05.2009 22:24