Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Фильтр по таблице, определенного слова (https://javascript.ru/forum/misc/67935-filtr-po-tablice-opredelennogo-slova.html)

aledavydkin 16.03.2017 10:36

Фильтр по таблице, определенного слова
 
Есть код,
<script type="text/javascript">
		function filter2 (phrase, _id){
			var words = phrase.value.toLowerCase().split(" "); 
			var table = document.getElementById(_id); 
			for (var r = 1; r < table.rows.length; r++){ 
				var cellsV1 = table.rows[r].cells[1].innerHTML.replace(""); 
				var cellsV = [cellsV1].join(""); 
				var displayStyle = 'none';
				for (var i = 0; i < words.length; i++) {
				if (cellsV.toLowerCase().indexOf(words[i])>=0)
					displayStyle = ''; 
				else {
					displayStyle = 'none'; 
					break;
				}
				}
			table.rows[r].style.display = displayStyle; 
			}
		}
	</script>

Таблица
<div class="">Сотировка таблицы</div> <input name="filt" onkeyup="filter2(this, 'product-feature')" style="width:350px;" type="text" />
	<table class="table" id="product-feature" >
		<thead>
			<tr><th data-type="number">ID</th><th> Города</th></tr>
		</thead>
		<tbody>
			<tr><td>1</td><td>Миша</td></tr>
			<tr><td>2</td><td>Саня</td></tr>
			<tr><td>3</td><td>Машина</td></tr>
			<tr><td>4</td><td>Самолет</td></tr>
			<tr><td>5</td><td>Обруч</td></tr>
		</tbody>
	</table>


Задача, при вводе полу слова "Сам", оставалось ток срока Самолет. Если ввести "обруч" и тд, то нечего бы не происходило.

aledavydkin 16.03.2017 10:37

Сейчас на данный момент ищет все сподряд.

рони 16.03.2017 11:15

Фильтрация строк таблицы
 
aledavydkin,
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">

<script type="text/javascript">
  function filter2(phrase, _id) {
    var words = phrase.value;
    var show = [].filter.call(document.querySelectorAll("#" + _id + " tbody tr"), function(tr) {
        var text = tr.cells[1].textContent;
        tr.style.display = text.indexOf(words) == 0 ? "" : "none";
        return text.indexOf(words) == 0
    });
    if (!show.length)[].forEach.call(document.querySelectorAll("#" + _id + " tbody tr"), function(tr) {
        tr.style.display = ""
    })
};  </script>

</head>

<body>

<div class="">Фильтрация строк таблицы</div> <input name="filt" onkeyup="filter2(this, 'product-feature')" style="width:350px;" type="text" />
  <table class="table" id="product-feature" >
    <thead>
      <tr><th data-type="number">ID</th><th> Города</th></tr>
    </thead>
    <tbody>
      <tr><td>1</td><td>Миша</td></tr>
      <tr><td>2</td><td>Саня</td></tr>
      <tr><td>3</td><td>Машина</td></tr>
      <tr><td>4</td><td>Самолет</td></tr>
      <tr><td>5</td><td>Обруч</td></tr>
    </tbody>
  </table>



</body>
</html>

aledavydkin 16.03.2017 12:29

Задача, при вводе полу слова "Сам", оставалось ток срока Самолет. Если ввести "обруч" и тд, то нечего бы не происходило.

рони 16.03.2017 15:23

aledavydkin,
смотрите пост №3 снова


Часовой пояс GMT +3, время: 09:37.