Can different classes and attributes be applied on a single label in crispy forms?

This is my first time using crunchy molds. And I want to use a separate one css_class

for each label according to their length. And also want to use css property for label and corresponding fields. I tried various methods but failed. Please help me.

forms.py

''' ~~~ Import Statements ~~~ '''
from django import forms 
from crispy_forms.helper import FormHelper
from crispy_forms.layout import Submit, Layout, Field ,Fieldset,Div,Row,Reset,Button
from crispy_forms.bootstrap import (PrependedText, PrependedAppendedText,InlineField, FormActions)


class student_personal_infoForm(forms.Form):

first_name = forms.CharField(label="First Name",required=True,max_length=20, widget = forms.TextInput(attrs={'placeholder':'First Name', 'required':True}))
middle_name = forms.CharField(label="",required=False,max_length=20, widget = forms.TextInput(attrs={'placeholder':'Middle Name'}))
last_name= forms.CharField(label="", required=True,max_length=20,widget = forms.TextInput(attrs={'placeholder':'Last Name', 'required':True}))

father_name = forms.CharField(label="Father Name", required=True,max_length=20,widget = forms.TextInput(attrs={'placeholder':'Father Name', 'required':True}))
mother_name = forms.CharField(label="Mother Name", required=True,max_length=20,widget = forms.TextInput(attrs={'placeholder':'Mother Name', 'required':True}))

helper = FormHelper()
helper.form_method = 'POST'
helper.label_class = 'col-md-4'
helper.form_class = 'form-inline'
helper.field_class = 'col-md-4 control-label'
helper.layout = Layout(
Div(
    Row(  
        Field('first_name',css_class='control-label'),
        Field('middle_name',css_class='control-label'),
        Field('last_name',css_class='control-label'),
        css_class='row-fluid divs panel')
  ),
Div(
    Row(
        Div(
            Field('father_name', css_class='control-label'), 
            css_class='pull-left'),
        Div(
            Field('mother_name', css_class='control-label'), 
            css_class='col-md-6'),
        css_class='row-fluid divs panel')
    ), 
)

      

Using this code, my form looks very ugly because it is not well aligned. Please suggest me a solution.

+3


source to share


1 answer


Just pass it in widget

the same way as required

, and placeholder

:



widget=forms.TextInput(attrs={
    'class': 'special',
    'placeholder':'First Name',
    'required':True,
})

      

0


source







All Articles