फॉर्म फ़ील्ड पर टैबिंडेक्स कैसे सेट करें?

Question

मैं फॉर्म फ़ील्ड पर HTML विशेषता "tabindex" कैसे सेट करूं?

मेरे टेम्प्लेट वर्तमान में लग रहा है .. जैसे

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

Answer 1

आप विजेट overide और टैब सूचकांक सेट के साथ एक attrs शब्दकोश प्रदान कर सकते हैं:

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

Answer 2

एलेक्स के सभी क्रेडिट, लेकिन सिर्फ समाधान को भरने के लिए:

Django ऑटो formfield पीढ़ी (विजेट), टेम्पलेट्स आप के लिए है के बारे में भूल का उपयोग करते समय इस तरह प्रपत्र परिभाषा यह कार्य करें:

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

हो जाता है:

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

लेकिन अगर आप विगेट्स का परित्याग और टेम्पलेट में प्रस्तुति रखने के लिए तैयार हैं आप भी इसे इस तरह कर सकते हैं:

<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> 

मैं बाद वाले की ओर झुका हुआ हूं।

Answer 3

जॉन को सभी क्रेडिट, लेकिन {{form.email.data|default:''}} रूप में प्रदान किसी भी प्रारंभिक डेटा की अनदेखी करने लगती है।

$.each({ 
    'email': 1 
    // add other fields here 
}, function (key, value) { 
    $('#id_' + key).attr('tabindex', value); 
}); 

{{ form.email }} इच्छा उत्पादन इनपुट क्षेत्र के साथ संयुक्त और सभी विजेट के बिना/attr mumbo- जंबो एक tabindex देते है कि विशेष रूप से अप्रिय जब एक ModelForm का उपयोग कर: मैं कुछ jQuery का उपयोग कर इस दर्दनाक Django कमी से बचने के लिए समाप्त हो गया ।

Answer 4

टैब सूचकांक लेआउट की एक विशेषता है, और इसलिए यह लगता है जैसे यह वास्तव में, टेम्पलेट में अंतर्गत आता हैध्यान में रखते हुए नहीं। यहाँ एक स्पष्ट दृष्टिकोण है कि इस को प्राप्त होता है:

सबसे पहले, एक custom template filter कि विजेट एक बाध्य क्षेत्र के लिए एक tabindex विशेषता कहते हैं परिभाषित:

@register.filter 
def tabindex(value, index): 
    """ 
    Add a tabindex attribute to the widget for a bound field. 
    """ 
    value.field.widget.attrs['tabindex'] = index 
    return value 

फिर, टेम्पलेट में क्षेत्रों के लिए |tabindex:n जोड़ें। उदाहरण के लिए:

<tr> 
<th>{{ form.first_name.label_tag }}<td>{{ form.first_name|tabindex:1 }} 
<th>{{ form.email.label_tag }}<td>{{ form.email|tabindex:3 }} 
<tr> 
<th>{{ form.last_name.label_tag }}<td>{{ form.last_name|tabindex:2 }} 
<th>{{ form.active.label_tag }}<td>{{ form.active|tabindex:4 }} 

Answer 5

आप भी इस के लिए django-widget-tweaks उपयोग कर सकते हैं।

render_field का उपयोग करना (मैं इस विधि पसंद करते हैं):

{% render_field form.email tabindex="4" %} 

वैकल्पिक रूप से, attr फिल्टर का उपयोग कर:

{{ form.email|attr:"tabindex:4" }}