2014-02-11 2 views
1

Я пытаюсь использовать list.js для реализации «живого» поиска в таблице. Я успешно тестировал списки (что-то вроде примера в http://listjs.com/examples/existing-list). Однако я не могу воспроизвести это поведение для таблиц.List.js не работает для таблиц

Я сделал этот небольшой код, чтобы воспроизвести проблему:

<!DOCTYPE html> 
<html><head> 
<title>Test try</title> 
<meta charset="UTF-8"> 

<script type="text/javascript" src="list.min.js"></script> 

</head><body> 

<div id="payload"> 
<input class="search" placeholder="Search"> 
<table style="border: 1px solid black"> 
    <thead> 
     <th>a</th> 
     <th>b</th> 
     <th>c</th> 
     <th>d</th> 
    </thead> 
    <tbody class="list" > 
     <tr> 
      <td class="a">Lorem </td> 
      <td class="b">ipsum </td> 
      <td class="c">dolor </td> 
      <td class="d">sit </td> 
     </tr> 
     <tr> 
      <td class="a">amet</td> 
      <td class="b">consectetur </td> 
      <td class="c">adipiscing </td> 
      <td class="d"> elit </td> 
     </tr> 
    </tbody> 
</table> 
</div> 

<script> 
    var options = {ValueNames: ['a','b','c','d']}; 
    var searchable = new List('payload', options); 
</script> 

</body> 
</html> 

По какой-то причине я не мог определить, что это не работает, в FF любой вход на поле поиска очищает тело таблицы, и удаление он не восстанавливает таблицу. Вы можете мне помочь?

ответ

2

У вас есть опечатка в имени переменной ValueNames, которая должна быть valueNames. Рабочий пример вашего кода: http://jsfiddle.net/pTEJ3/

+0

Hallo @pna, есть в любом случае иметь несколько поисковых полей для одной таблицы, чтобы каждый столбец имел собственное поле поиска? –

Смежные вопросы