tags:

views:

268

answers:

2

How do i set the html attribute "tabindex" on form fields?

My template currently looks like..

<div class="field text username">
   <label>Email Address</label>
   {{ form.email }}
</div>
+2  A: 

You can overide the widget and provide an attrs dictionary with the tab index set:

http://docs.djangoproject.com/en/dev/ref/forms/widgets/#django.forms.Widget.attrs

Alex Gaynor
+2  A: 

All credit to Alex, but just to fill out the solution:

When using the django auto formfield generation (widgets), forget about the templates you have to do it in the form definition like this:

class AuthenticationForm(forms.Form):
    email    = forms.CharField(label=_("Email Address"), max_length=75)

becomes:

class AuthenticationForm(forms.Form):
    email    = forms.CharField(
                   label=_("Email Address"), max_length=75,
                   widget=forms.TextInput(attrs={'tabindex':'1'})
                )

But if you're willing to abandon the widgets and keep presentation in the template you can also do it this way:

<div class="field text username">
   <label>Email Address</label>
   <input id="id_email" type="text" name="email" 
       tabindex="1" maxlength="75" 
       value="{{form.email.data|default:''}}"/>
</div>

I'm inclined toward the latter.

John Mee