faq/app/views/admin/faqs/index.html.erb

<% content_for :right_nav do %>
	<ul class="nav nav-pills filter-nav pull-right">
		<% @filter_fields.keys.each do |field| %>
			<li class="accordion-group">
				<div class="accordion-heading">
					<a href="#collapse-<%= field %>" data-toggle="collapse" data-parent="#filter" class="accordion-toggle"><%= t(field) %></a>
				</div>
			</li>
		<% end %>
	</ul>
	<div class="filter-group accordion-group">
		<% @filter_fields.keys.each do |field| %>
			<div class="accordion-body collapse" id="collapse-<%= field %>">
				<div class="accordion-inner pagination-right" data-toggle="buttons-checkbox">
					<% @filter_fields[field].each do |val| %>
						<%= link_to t(val[:title]), "#", :onclick => "filter.addFilter('filters[#{field}][]=#{val[:id]}')", :class => "btn btn-small #{is_filter_active?(field, val[:id])}" %>
					<% end %>
				</div>
				<div class="filter-clear">
					<a href="" class="btn btn-link btn-small"><i class="icons-cycle"></i> <%= t(:clear) %></a>
				</div>
			</div>
		<% end %>
	</div>
<% end %>
<div id="faqslist">
	<%= render 'index'%>
</div>
<script type="text/javascript">

	var Filter = function(dom){
		var makeFilters = function(){
			return (window.location.search ? window.location.search.replace('?','').split('&') : []);
		}
		var filters = makeFilters(),
			dom = $(dom),
			mainUrl = window.location.pathname;
		var updateTable = function(url){
			xurl = (url == null ? ( filters.length ?  mainUrl + "?" + filters.join('&') : mainUrl ) : null);
			$.ajax({
				url : xurl,
				type : "get",
				dataType : "html" 
			}).done(function(data){
				history.pushState(null, null, decodeURIComponent(xurl));
				filters = makeFilters();
				dom.html(data);
				$(".pagination a").click(function(){
					updateTable($(this).attr('href'));
					return false;
				});
			})
		}
		this.addFilter = function(filter){
			$.each(filters,function(idx,data){
				if(data.indexOf("page=")>-1) filters.splice(idx,1);
			});

			if( (index = filters.indexOf(filter) ) > -1){
				mainUrl = mainUrl.replace(filter,'');
				filters.splice(index,1);
			}else{
				filters.push(filter);
			}

			updateTable();
			return false;
		};
	}
	var	filter = new Filter("#faqslist");
</script>