Merge tag 'v2.6' into fiksgatami-dev

1 files changed, 46 insertions, 0 deletions

diff --git a/docs/_posts/2016-12-06-v2.0-multi-select.md b/docs/_posts/2016-12-06-v2.0-multi-select.md
new file mode 100644
index 000000000..aaa5c9fa9
--- /dev/null
+++ b/docs/_posts/2016-12-06-v2.0-multi-select.md
@@ -0,0 +1,46 @@
+---
+layout: post
+title: Version 2.0 – Multi-select dropdown jQuery plugin
+author: zarino
+---
+
+There are several types of 'list page' on FixMyStreet: for example, when you
+view all reports from a specific body, or when you log into your account to see
+reports you have made.
+
+For quite a while now, users have been able to filter these by state (eg
+'fixed' or 'in progress') or category (eg 'pothole', 'streetlight', etc), but a
+recent suggestion from Oxfordshire County Council prompted us to look again at
+this functionality and improve it.
+
+So now it's simple to filter by multiple states or categories: want to see all
+unfixed potholes? All streetlights or flytipping reports that are fixed? No
+problem.
+
+HTML's `<select multiple>` is not the nicest tool in the box, especially when
+it comes to actually selecting multiple options. It usually involves holding
+down a key, but that key is different depending upon your operating system.
+
+So I looked at existing JavaScript plugins and finding nothing suitable created
+a very simple jQuery plugin which is available at
+[https://github.com/mysociety/jquery-multi-select](https://github.com/mysociety/jquery-multi-select).
+
+By default, it converts a multiple select into a dropdown with checkboxes:
+
+<img src="/assets/posts/multi-select-people.png" alt="">
+
+The options can be wrapped within a container to stop the dropdown overlapping other content:
+
+<img src="/assets/posts/multi-select-line-wrap.png" alt="">
+
+With options in the constructor, you can specify text for when all/no options
+are selected, and specify groups of options as presets that will be listed at
+the top of the dropdown:
+
+<img src="/assets/posts/multi-select-groups.png" alt="">
+
+On FixMyStreet, we have used this for both the state and category filters on list pages:
+
+<img src="/assets/posts/multi-select.png" alt="">
+
+Let us know if you find the plugin useful!