Public Side Multiple Category Filter

txpdevcoder · 2013-06-10 12:43:19

Apologies if this has been asked before, but its really hard to find an answer!

Basically I want the user on the public side to be able to check multiple radio boxes to restrict the articles being shown to them.

I understand there are various tags to display specific articles and category links can be used to display articles belonging to ONE single category.

I also understand that it is possible to list out all articles and use javascript to sort them however this approach will have performance issues when the blog gets full of articles over time and also it may or may not work accross pagination.

So to clarify, imagine i have 5 categories. I have 5 radio boxes on my page. If the website user selects at least one radio box, I want the article list to update to only show those articles belonging to that category. If the user then checks another radio, I want those articles ADDED to the current list. If a third radio is checked, then these need to be added and so on. It also needs to be reversable, so if a box gets unticked then those articles need to be removed from the article list

Ideally i need this to work with the built in tags and with paginiation, either native or ob1_pagination.

Is this possible, either natively or with plugins?

Thanks!

txpdevcoder · 2013-06-10 13:08:13

My bad, it actually needs to be check boxes rather than radios.

etc · 2013-06-10 13:33:43

article_custom accepts multiple comma-separated categories, so you could use it (jointly with adi_gps?) server-side. Built-in (neither ob1_) pagination will not work, but etc_pagination will.

Cllent-side, ajax looks like a natural solution.

txpdevcoder · 2013-06-10 13:40:41

Thanks.

All this needs to happen client side. Do you have any idea how it will work with Ajax?

Bloke · 2013-06-10 13:52:11

As etc says, you can do that if you want to do things via category. There’s an unreleased smd_ajax plugin that can help do it neatly from the client without refresh, but pagination might be challenging.

Alternatively you could go for a tagging plugin. smd_tags for example (at least the latest beta) has the ability to filter with AND / OR logic from the URL. So you could tag your articles and offer a complete list, tree, cloud, checkbox group, whatever showing the tags in use.

If you put such controls in a form that was auto-submitted whenever one was selected, the URL params would be submitted and the plugin could filter the content only containing those tags, directly in place on the page. You won’t have to worry about manually removing tags that have been deselected because they’ll be automatically removed from the URL on next submission. You could even batch it up so that users had to check the things to search up-front and then hit a Go button to do it all in one submission. Depends how you want to present it. It could also work via AJAX if you wished, but again pagination might be the sticking point. I’ve never actually tried that sort of thing (it’s on my todo list) and I don’t know how easy it’d be to maintain the selection across pages, but I built the plugin with that sort of filtering capability as an end goal.

If tagging is too over the top or you don’t want the image, file, and link tagging that the plugin offers, then knocking something together with adi_gps and article_custom using multiple categories is a simple way to achieve what you want. But if you want to do it all without page refresh then your options start to reduce. You’re really then looking at loading all content up front and using jQuery to filter it, which is slow, or figuring out how to paginate content returned from an AJAX request. There might be a jQuery plugin for that.

txpdevcoder · 2013-06-10 13:59:07

Thanks Bloke, for the hefty answer! I shall see if the page refresh is an acceptable compromise. I would like to steer away from getting jQuery to sort the articles as this throws up other issues to take care of, as you noted!

Let you know if i crack it :)

etc · 2013-06-10 14:14:59

All can not happen client-side, unless you retrieve all articles at once. You should attach some ajax calls to checkboxes, jQuery is the easiest way. Try this to see if the checked categories are properly detected:

<script type="text/javascript">
$(function () {
	$("#my-form input[type='checkbox']").change(function(){
	var values = $('input:checkbox:checked').map(function () { return this.value;}).get();
	alert(values.join(","));});
});
</script>

Textpattern CMS

Textpattern CMS support forum

#1 2013-06-10 12:43:19

Public Side Multiple Category Filter

#2 2013-06-10 13:08:13

Re: Public Side Multiple Category Filter

#3 2013-06-10 13:33:43

Re: Public Side Multiple Category Filter

#4 2013-06-10 13:40:41

Re: Public Side Multiple Category Filter

#5 2013-06-10 13:52:11

Re: Public Side Multiple Category Filter

#6 2013-06-10 13:59:07

Re: Public Side Multiple Category Filter

#7 2013-06-10 14:14:59

Re: Public Side Multiple Category Filter

Board footer