Add select2 widget to the form

opentech/apply/dashboard/tables.py

 import django_filters as filters
 import django_tables2 as tables
+from django_select2.forms import Select2MultipleWidget
 
 from wagtail.wagtailcore.models import Page
 
@@ -30,9 +31,15 @@ def get_used_funds(request):
     return Page.objects.filter(applicationsubmission__isnull=False).distinct()
 
 
+class Select2ModelMultipleChoiceFilter(filters.ModelMultipleChoiceFilter):
+    def __init__(self, *args, **kwargs):
+        kwargs.setdefault('widget', Select2MultipleWidget)
+        super().__init__(*args, **kwargs)
+
+
 class SubmissionFilter(filters.FilterSet):
-    round = filters.ModelMultipleChoiceFilter(queryset=get_used_rounds)
-    page = filters.ModelMultipleChoiceFilter(queryset=get_used_funds, label='Funds')
+    round = Select2ModelMultipleChoiceFilter(queryset=get_used_rounds)
+    page = Select2ModelMultipleChoiceFilter(queryset=get_used_funds, label='Funds')
 
     class Meta:
         model = ApplicationSubmission

opentech/apply/dashboard/templates/dashboard/dashboard.html

@@ -24,3 +24,7 @@
     {% render_table table %}
 </div>
 {% endblock %}
+
+{% block extra_js %}
+    {{ filter.form.media }}
+{% endblock %}

opentech/settings/base.py

@@ -58,6 +58,7 @@ INSTALLED_APPS = [
     'wagtailcaptcha',
     'django_tables2',
     'django_filters',
+    'django_select2',
     'addressfield',
 
     'django.contrib.admin',

opentech/urls.py

@@ -24,6 +24,7 @@ urlpatterns = [
     url('^', include(apply_urls)),
     url('^', include('social_django.urls', namespace='social')),
     url(r'^tinymce/', include('tinymce.urls')),
+    url(r'^select2/', include('django_select2.urls')),
 ]
 
 

requirements.txt

@@ -20,6 +20,7 @@ flake8
 social_auth_app_django==2.1.0
 django-tables2==1.17.1
 django-filter==1.1.0
+django_select2==6.0.1
 
 # Production dependencies
 dj-database-url==0.4.1