django crispy form does not work in the template - django

Question

I'm trying to make my form-fields to be in a row like this html code down below, but it does not work, I want all the fields in the PrimryForm class to be in a row not in a column:
Html code:
<link href="https://cdn.jsdelivr.net/npm/bootstrap#5.0.2/dist/css/bootstrap.min.css"
rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC"
crossorigin="anonymous">
<div class="container">
<div class="row">
<div class="col">
<div class="form-group">
<input type="text" class="form-control">
</div>
</div>
<div class="col">
<div class="form-group">
<input type="text" class="form-control">
</div>
</div>
<div class="col">
<div class="form-group">
<input type="text" class="form-control">
</div>
</div>
</div>
</div>
Forms.py file:
from crispy_forms.helper import FormHelper
from crispy_forms.layout import Layout, Row, Column
class PrimaryForms(forms.ModelForm):
signature_of_student = JSignatureField(
widget=JSignatureWidget(
jsignature_attrs={'color':'#e0b642', 'height':'200px'}
)
)
signature_of_guardian = JSignatureField(
widget=JSignatureWidget(
jsignature_attrs={'color':'#e0b642', 'height':'200px'}
)
)
date_of_birth = forms.DateField(widget=forms.DateInput(attrs={'type': 'date'}))
class Meta:
model = Primary
fields = ['admission_number', 'profile_picture', 'first_name',
'last_name', 'gender', 'address_of_student', 'class_Of_student',
'comment_of_student',
'year_of_graduation', 'date_of_birth', 'religion', 'mother_name', 'signature_of_student',
'relationship', 'signature_of_guardian']
def __init__(self, *args, **kwargs):
super().__init__(*args, **kwargs)
self.helper = FormHelper()
self.helper.form_method = 'post'
self.helper.form_class = 'form-horizontal'
self.helper.label_class = 'col-md-3'
self.helper.field_class = 'col-md-9'
My Form/template:
{% load crispy_forms_tags %}
<div class="container">
<div class="row justify-content-center">
<div class="col">
<form method="post" enctype="multipart/form-data">
{% csrf_token %}
{% crispy form %}
<br>
<button type="submit" class="btn btn-primary">Create Student</button>
</form>
</div>
</div>
</div>
How can I do this using django-crispy-form?

Answer 1

I solve my problem using boostrap-5 ROW and COLUMN in the template
from this template:
{% load crispy_forms_tags %}
<div class="container">
<div class="row justify-content-center">
<div class="col">
<form method="post" enctype="multipart/form-data">
{% csrf_token %}
{% crispy form %}
<br>
<button type="submit" class="btn btn-primary">Create Student</button>
</form>
</div>
</div>
</div>
To This:
{% load crispy_forms_tags %}
<br>
<form action="" method="post" enctype="multipart/form-data">
{% csrf_token %}
<div class="container">
<div class="form-group row">
<div class="col">
{{form.admission_number|as_crispy_field}}
</div>
<div class="col">
{{form.profile_picture|as_crispy_field}}
</div>
<div class="col">
{{form.first_name|as_crispy_field}}
</div>
<div class="col">
{{form.last_name|as_crispy_field}}
</div>
</div>
<div class="tex-center">
<button type="submit" class="btn btn-primary btn-lg">Create Student</button>
</div>
</div>
</form>