Django using admin horizontal filter in forms

 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
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
# forms.py
from django import forms
from django.contrib.admin.widgets import FilteredSelectMultiple

class TagForm(forms.Form):
    tags = forms.ModelMultipleChoiceField(queryset=Tag.objects.all(),
                                          label=_('Select tags'),
                                          required=False,
                                          widget=FilteredSelectMultiple(
                                                    _('tags'),
                                                    False,
                                                 ))

    class Media:
        css = {
            'all':['admin/css/widgets.css',
                   'css/uid-manage-form.css'],
        }
        # Adding this javascript is crucial
        js = ['/admin/jsi18n/']

#######################
# template
<!--HEAD -->
{{ form.media }}
<!--BODY-->
{{ form }}

#######################
# extra css

.selector{
    float:none;
    display:block;
    height:330px;
}

.selector input[type="submit"]{
    display:block;
    clear:both;
}

.selector h2{
    font-size:15px;
}
.selector  select{
    margin: 2px 0;
    padding: 2px 3px;
    font-weight: normal;
    width: 270px !important;
    height: 17.2em;
}

textarea{
    display:block;
    width:450px;
}

More like this

  1. When saving in admin it will call model save() twice. by jasonyan 2 years ago
  2. Javascript Chain Select Widget by ogo 4 years, 11 months ago
  3. Add special field lookups to the Admin list_filter display by whiteinge 5 years, 3 months ago
  4. Custom color field with Javascript color picker by seanl 4 years, 10 months ago
  5. Silently-failing include tag by brutasse 2 years, 11 months ago

Comments

ntmq (on September 16, 2011):

Thanks so much for your sharing. I have just tried. This is my result : http://nc3.upanh.com/b5.s10.d4/7fad8e7cb8f0320593cba6a8947c9d42_35235923.screenshot20110916at6.png It looks nice but no javascript function works. I test on Firefox and Chrome on MAC.

And this is my source code : http://www.mediafire.com/?t1tzzxl12etxlzj Did I make something wrong? Thanks.

#

(Forgotten your password?)