[英]Django crispy forms inline label and input field
I have a Django ModelForm containing 3 fields: name, lastname, email.我有一个 Django ModelForm 包含 3 个字段:姓名、姓氏、email。 What I want is to adjust the crispy form to have each field along with it's label in one line, so the form will look like this:我想要的是调整酥脆的表格,让每个字段连同它的 label 在一行中,所以表格看起来像这样:
Name: <input name>
Lastname: <input lastname>
Email: <input email>
<button Submit>
I tried with FormHelper and Layout and bootstrap inline attribute but all I achieved was having all elements in the form in one line.我尝试使用 FormHelper 和 Layout 以及引导内联属性,但我所取得的只是将表单中的所有元素放在一行中。
I'm really bad at frontend and I'm stuck.我在前端真的很糟糕,我被卡住了。
Assuming your settings.py contains:假设您的 settings.py 包含:
CRISPY_TEMPLATE_PACK = 'bootstrap4'
you probably want to override the template bootstrap4/field.html
which is the one that places the label and the various possible input field together.您可能想要覆盖模板bootstrap4/field.html
,这是将 label 和各种可能的输入字段放在一起的模板。
to do so, you can copy the templates/bootstrap4/field.html
file from the crispy_form package into your templates/bootstrap4/field.html
in your application and have it modified as per your needs.为此,您可以将 Krispy_form package 中的templates/bootstrap4/field.html
文件复制到您的templates/bootstrap4/field.html
中,并根据您的应用程序对其进行修改。Z5 When the template engine will render the form fields, it will find your modified field.html
before the one in the original template.当模板引擎渲染表单字段时,它会在原始模板中找到您修改的字段field.html
。
you may also want to be refered to the template pack uni_form
which, without css, renders the fields almost the way you want.您可能还希望参考模板包uni_form
,如果没有 css,它几乎可以按照您想要的方式呈现字段。 You can use it as is or get yourself inspired by the way it is structured to modify your own field.html
.您可以按原样使用它,也可以通过它的结构方式来修改您自己的field.html
来获得灵感。
I managed to achieve my goal by simply changing {{ my_form|crispy }}
to {{ my_form.as_p }}
in my html code.我通过简单地将 html 代码中的{{ my_form|crispy }}
更改为{{ my_form.as_p }}
来实现我的目标。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.