How do I set custom HTML attributes in django forms?

Question

I have a Django form that is part of page. Lets say I have a field:

search_input = forms.CharField(_(u'Search word'), required=False)

I can access it only in template via {{ form.search_input }}. How to set custom HTML attrs (such as name and value)? I would like to find flexible solution, that would allow me to add any needed custom attributes to all types of fields.

I found https://docs.djangoproject.com/en/dev/ref/forms/widgets/#widget

But using attrs gives me (if used with CharField):

__init__() got an unexpected keyword argument 'attrs'

mcanterb · Accepted Answer · 2011-08-29 14:45:05Z

29

You can change the widget on the CharField to achieve the effect you are looking for.

search_input = forms.CharField(_(u'Search word'), required=False)
search_input.widget = forms.TextInput(attrs={'size': 10, 'title': 'Search',})

answered Aug 29, 2011 at 14:45

mcanterb

6195 silver badges4 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Flimm · Accepted Answer · 2016-11-17 09:33:33Z

11

You can also try this:

search_input = forms.CharField(
    _(u'Search word'),
    required=False,
    widget=forms.TextInput(attrs={'size': 10, 'title': 'Search',})
)

This is documented in the section entitled Styling widget instances.

edited Nov 17, 2016 at 9:33

Flimm

154k49 gold badges282 silver badges295 bronze badges

answered Aug 29, 2011 at 15:05

Don

17.7k13 gold badges67 silver badges106 bronze badges

Comments

John Lehmann · Accepted Answer · 2015-07-14 12:01:54Z

9

There's also the template-only solution using a filter. I recommend django-widget-tweaks:

{% load widget_tweaks %}

{{ form.email|attr:'required:true' }}

answered Jul 14, 2015 at 12:01

John Lehmann

8,2755 gold badges61 silver badges72 bronze badges

1 Comment

CutePoison Over a year ago

I havent been able to make this work if I want to change e.g "pattern"

webtweakers · Accepted Answer · 2013-10-08 09:17:06Z

8

Old question, but for who-ever is looking for another alternative, there's also this: https://docs.djangoproject.com/en/1.6/topics/forms/modelforms/#overriding-the-default-fields

You can do something like this:

from django.forms import ModelForm, Textarea
from myapp.models import Author

class AuthorForm(ModelForm):
    class Meta:
        model = Author
        fields = ('name', 'title', 'birth_date')
        widgets = {
            'name': Textarea(attrs={'cols': 80, 'rows': 20}),
        }

answered Oct 8, 2013 at 9:17

webtweakers

7651 gold badge8 silver badges21 bronze badges

Collectives™ on Stack Overflow

How do I set custom HTML attributes in django forms?

4 Answers 4

Comments

Comments

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related