Multiple Select Widget with jQueryUI

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
class MultiSelectWidget(forms.SelectMultiple):
    class Media:
        css = {
            'all': (
                iasettings.MEDIA_URL + 'js/michael-multiselect/css/ui.multiselect.css',
            )
        }
        js = (
            iasettings.MEDIA_URL + 'js/michael-multiselect/js/plugins/tmpl/jquery.tmpl.1.1.1.js',
            iasettings.MEDIA_URL + 'js/michael-multiselect/js/plugins/blockUI/jquery.blockUI.js',
            iasettings.MEDIA_URL + 'js/michael-multiselect/js/ui.multiselect.js',
        )

    def __init__(self, language=None, attrs=None):
        self.language = language or settings.LANGUAGE_CODE[:2]
        super(MultiSelectWidget, self).__init__(attrs=attrs)

    def render(self, name, value, attrs=None):
        rendered = super(MultiSelectWidget, self).render(name, value, attrs)
        return rendered + mark_safe(u'''<script type="text/javascript">
            $(document).ready(function afterReady() {
                var elem = $('#id_%(name)s');
                elem.multiselect();
            });
            </script>''' % {'name':name})

More like this

  1. Select Dropdown Widget with jQueryUI by maguspk 3 years, 10 months ago
  2. Convert multiple select for m2m to multiple checkboxes in django admin form by abidibo 1 year ago
  3. jQuery Autocomplete by zeeg 6 years, 10 months ago
  4. Orderable inlines using drag and drop with jQuery UI by simon 5 years, 7 months ago
  5. Drag and drop ordering of admin list elements using jQuery UI by johj 3 years, 10 months ago

Comments

(Forgotten your password?)