Hug*_*ugs 4 jquery twitter-bootstrap
我正在使用我的Rails应用程序中的数据填充Twitter引导手风琴,我希望能够过滤数据.我找到了一些不错的jQuery插件,但似乎都没有过滤数据.这是因为它不是一个简单的清单吗?编辑:不再使用列表.这是我到目前为止的代码:
<div id="descriptions">
<% unless @subcategories.nil? %>
<form class="filterform" action="#">
<input class="filterinput" type="text">
</form>
<div id="list" class="display-subcategory">
<div class="accordion" id="accordion2">
<% @subcategories.each do |s| %>
<% unless s.description == "No description yet"%>
<div class="accordion-group">
<div class="accordion-heading">
<a class="accordion-toggle purple-text" data-toggle="collapse" data-parent="#accordion2" href="#collapse<%=s.name.gsub(/\s+/, "")%>">
<h3><%= s.name %> </h3>
</a>
</div>
<div id="collapse<%=s.name.gsub(/\s+/, "")%>" class="accordion-body collapse out">
<div class="accordion-inner">
<%= s.description.html_safe %>
</div>
</div>
</div>
<% end %>
<% end %>
</div>
</div>
<% end %>
</div>
Run Code Online (Sandbox Code Playgroud)
这是我正在使用的插件:http://anthonybush.com/projects/jquery_fast_live_filter/
编辑:我不再使用此插件,我将尝试编写自己的过滤器功能.
我试图按项目的名称过滤,但我无法弄清楚这一点,并希望得到一些帮助.谢谢.
这是我用来过滤手风琴的jQuery,我用这个jfiddle帮助http://jsfiddle.net/U8T8p/10/:
(function($) {
$('.filterinput').keyup(function() {
var a = $(this).val();
if (a.length > 0) {
children = ($("#accordion2").children());
var containing = children.filter(function () {
var regex = new RegExp('\\b' + a, 'i');
return regex.test($('a', this).text());
}).slideDown();
children.not(containing).slideUp();
} else {
children.slideDown();
}
return false;
})
}(jQuery));
Run Code Online (Sandbox Code Playgroud)
因此,这使用正则表达式来查找我的手风琴标题,如果它们与输入不匹配则隐藏它们.希望这无论如何都可以帮助别人.
| 归档时间: |
|
| 查看次数: |
5029 次 |
| 最近记录: |