使用 bootstrap3 作为 crispy 表单的模板包时出现 TemplateDoesNotExist 错误
Getting TemplateDoesNotExist error when using bootstrap3 as template pack for crispy forms
我正在为我的 django 项目使用 django-crispy-forms,并阅读 documentation I saw that to be able to use bootstrap3 features (like horizontal forms),我需要通过在settings.py 我的项目:
CRISPY_TEMPLATE_PACK = 'bootstrap3'
根据文档,crispy 的默认设置是 bootstrap v2。但是在我的设置中添加 bootstrap3 之后,当我 运行 我的应用程序在我的开发机器上时,我得到这个错误:
TemplateDoesNotExist at /dashboard/
bootstrap3/field.html
Request Method: POST
Request URL: http://localhost:8000/dashboard/
Django Version: 1.7.3
Exception Type: TemplateDoesNotExist
Exception Value:
bootstrap3/field.html
Exception Location: C:\Python27\VirtualEnvs\Tlaloc\lib\site-packages\django\template\loader.py in find_template, line 136
Python Executable: C:\Python27\VirtualEnvs\Tlaloc\Scripts\python.exe
Python Version: 2.7.7
如果我从我的设置中删除 CRISPY_TEMPLATE_PACK 行(使用默认值)或将其更改为如下所示:
CRISPY_TEMPLATE_PACK = 'bootstrap'
然后我不再收到错误消息,但是水平表单 class 在我的表单中不起作用。
这是我的表单在 forms.py
中的样子
class UserForm(forms.Form):
user = forms.CharField(label='Account', max_length=15)
password = forms.CharField(widget=forms.PasswordInput())
# Crispy forms code
def __init__(self, *args, **kwargs):
super(UserForm, self).__init__(*args, **kwargs)
self.helper = FormHelper()
self.helper.form_class = 'form-horizontal'
self.helper.label_class = 'col-sm-2'
self.helper.field_class = 'col-sm-10'
self.helper.layout = Layout(
Fieldset(
'',
'user',
'password',
),
Div(FormActions(
Submit('continue', 'Continue', css_class='btn btn-primary'),
Button('cancel', 'Cancel', css_class='btn btn-default',
data_dismiss='modal'),
),
css_class='modal-footer'
)
)
这是我模板的一部分:
{% load crispy_forms_tags %}
<div class="modal fade" id="adAccountModal" tabindex="-1" role="dialog" aria-labelledby="authenticationLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="authenticationLabel">{{ config_values.environment_name }} Environment Authentication</h4>
</div>
<div class="modal-body">
<p>Please enter the account and password that will be used to authenticate in the selected environment.</p>
{% crispy user_form %}
</div>
{% comment %}
The footer will be added through the user_form using Crispy Forms.
The following code will be just left here as reference.
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
<button type="button" class="btn btn-primary">Continue</button>
</div>
{% endcomment %}
</div>
</div>
</div>
我做错了什么?
原来我安装的crispy forms中不存在bootstrap3模板目录。
我的 Windows 系统上安装了 Crispy Forms 1.3.2 版。查看 github 中的项目页面,我看到当前版本(目前为 1.4.0)确实有 \crispy_forms\templates\bootstrap3 目录。看起来这个版本之前引入了 bootstrap3 模板包,旧版本没有模板包。我升级到当前版本,现在可以使用了。
- 在
settings.py
文件中,包括:
CRISPY_ALLOWED_TEMPLATE_PACKS = ('bootstrap', 'uni_form', 'bootstrap3', 'foundation-5')
- 然后,在
register.html
中写下这段代码:
<!DOCTYPE html>
<!-- {% load static %} -->
<!-- {% load crispy_forms_tags %} -->
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<title>Django CRM - Register</title>
<!-- Custom fonts for this template-->
<link href="{% static 'vendor/fontawesome-free/css/all.min.css' %}" rel="stylesheet" type="text/css">
<link href="https://fonts.googleapis.com/css?family=Nunito:200,200i,300,300i,400,400i,600,600i,700,700i,800,800i,900,900i" rel="stylesheet">
<!-- Custom styles for this template-->
<link href="{% static 'css/sb-admin-2.min.css' %}" rel="stylesheet">
</head>
<body class="bg-gradient-primary">
<div class="container">
<div class="card o-hidden border-0 shadow-lg my-5">
<div class="card-body p-0">
<!-- Nested Row within Card Body -->
<div class="row">
<div class="col-lg-2 d-none d-lg-block"></div>
<div class="col-lg-8">
<div class="p-5">
<div class="text-center">
<h1 class="h4 text-gray-900 mb-4">Create an Account!</h1>
</div>
<form method="POST">
{% csrf_token %}
{{form|crispy}}
<button type="submit" class="btn btn-primary">Submit</button>
</form>
<hr>
<div class="text-center">
<a class="small" href="#">Forgot Password?</a>
</div>
<div class="text-center">
<a class="small" href="#">Already have an account? Login!</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Bootstrap core JavaScript-->
<script src="{% static 'vendor/jquery/jquery.min.js' %}"></script>
<script src="{% static 'vendor/bootstrap/js/bootstrap.bundle.min.js' %}"></script>
<!-- Core plugin JavaScript-->
<script src="{% static 'vendor/jquery-easing/jquery.easing.min.js' %}"></script>
<!-- Custom scripts for all pages-->
<script src="{% static 'js/sb-admin-2.min.js' %}"></script>
</body>
</html>
我正在为我的 django 项目使用 django-crispy-forms,并阅读 documentation I saw that to be able to use bootstrap3 features (like horizontal forms),我需要通过在settings.py 我的项目:
CRISPY_TEMPLATE_PACK = 'bootstrap3'
根据文档,crispy 的默认设置是 bootstrap v2。但是在我的设置中添加 bootstrap3 之后,当我 运行 我的应用程序在我的开发机器上时,我得到这个错误:
TemplateDoesNotExist at /dashboard/
bootstrap3/field.html
Request Method: POST
Request URL: http://localhost:8000/dashboard/
Django Version: 1.7.3
Exception Type: TemplateDoesNotExist
Exception Value:
bootstrap3/field.html
Exception Location: C:\Python27\VirtualEnvs\Tlaloc\lib\site-packages\django\template\loader.py in find_template, line 136
Python Executable: C:\Python27\VirtualEnvs\Tlaloc\Scripts\python.exe
Python Version: 2.7.7
如果我从我的设置中删除 CRISPY_TEMPLATE_PACK 行(使用默认值)或将其更改为如下所示:
CRISPY_TEMPLATE_PACK = 'bootstrap'
然后我不再收到错误消息,但是水平表单 class 在我的表单中不起作用。
这是我的表单在 forms.py
中的样子class UserForm(forms.Form):
user = forms.CharField(label='Account', max_length=15)
password = forms.CharField(widget=forms.PasswordInput())
# Crispy forms code
def __init__(self, *args, **kwargs):
super(UserForm, self).__init__(*args, **kwargs)
self.helper = FormHelper()
self.helper.form_class = 'form-horizontal'
self.helper.label_class = 'col-sm-2'
self.helper.field_class = 'col-sm-10'
self.helper.layout = Layout(
Fieldset(
'',
'user',
'password',
),
Div(FormActions(
Submit('continue', 'Continue', css_class='btn btn-primary'),
Button('cancel', 'Cancel', css_class='btn btn-default',
data_dismiss='modal'),
),
css_class='modal-footer'
)
)
这是我模板的一部分:
{% load crispy_forms_tags %}
<div class="modal fade" id="adAccountModal" tabindex="-1" role="dialog" aria-labelledby="authenticationLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="authenticationLabel">{{ config_values.environment_name }} Environment Authentication</h4>
</div>
<div class="modal-body">
<p>Please enter the account and password that will be used to authenticate in the selected environment.</p>
{% crispy user_form %}
</div>
{% comment %}
The footer will be added through the user_form using Crispy Forms.
The following code will be just left here as reference.
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
<button type="button" class="btn btn-primary">Continue</button>
</div>
{% endcomment %}
</div>
</div>
</div>
我做错了什么?
原来我安装的crispy forms中不存在bootstrap3模板目录。
我的 Windows 系统上安装了 Crispy Forms 1.3.2 版。查看 github 中的项目页面,我看到当前版本(目前为 1.4.0)确实有 \crispy_forms\templates\bootstrap3 目录。看起来这个版本之前引入了 bootstrap3 模板包,旧版本没有模板包。我升级到当前版本,现在可以使用了。
- 在
settings.py
文件中,包括:
CRISPY_ALLOWED_TEMPLATE_PACKS = ('bootstrap', 'uni_form', 'bootstrap3', 'foundation-5')
- 然后,在
register.html
中写下这段代码:
<!DOCTYPE html>
<!-- {% load static %} -->
<!-- {% load crispy_forms_tags %} -->
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<title>Django CRM - Register</title>
<!-- Custom fonts for this template-->
<link href="{% static 'vendor/fontawesome-free/css/all.min.css' %}" rel="stylesheet" type="text/css">
<link href="https://fonts.googleapis.com/css?family=Nunito:200,200i,300,300i,400,400i,600,600i,700,700i,800,800i,900,900i" rel="stylesheet">
<!-- Custom styles for this template-->
<link href="{% static 'css/sb-admin-2.min.css' %}" rel="stylesheet">
</head>
<body class="bg-gradient-primary">
<div class="container">
<div class="card o-hidden border-0 shadow-lg my-5">
<div class="card-body p-0">
<!-- Nested Row within Card Body -->
<div class="row">
<div class="col-lg-2 d-none d-lg-block"></div>
<div class="col-lg-8">
<div class="p-5">
<div class="text-center">
<h1 class="h4 text-gray-900 mb-4">Create an Account!</h1>
</div>
<form method="POST">
{% csrf_token %}
{{form|crispy}}
<button type="submit" class="btn btn-primary">Submit</button>
</form>
<hr>
<div class="text-center">
<a class="small" href="#">Forgot Password?</a>
</div>
<div class="text-center">
<a class="small" href="#">Already have an account? Login!</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Bootstrap core JavaScript-->
<script src="{% static 'vendor/jquery/jquery.min.js' %}"></script>
<script src="{% static 'vendor/bootstrap/js/bootstrap.bundle.min.js' %}"></script>
<!-- Core plugin JavaScript-->
<script src="{% static 'vendor/jquery-easing/jquery.easing.min.js' %}"></script>
<!-- Custom scripts for all pages-->
<script src="{% static 'js/sb-admin-2.min.js' %}"></script>
</body>
</html>