在保持 HTML 样式的同时编写 Django 表单

Posted 2023-02-24

【中文标题】在保持 HTML 样式的同时编写 Django 表单

【英文标题】：Writing a Django Form while keeping HTML styling

【发布时间】：2021-09-28 10:58:48

【问题描述】：

我有一个手动创建的 Django 表单，以保持样式的格式，但我意识到该表单受到多个输入的影响，并且手动更改每个输入花费的时间太长。

我还可以使用 form.as_p 自动生成表单，但我丢失了下面的 html 样式格式。有没有一种简单的方法可以代替手动更改每个输入？

这是我试图保留的原始 HTML 模板

        </button>
          <div class="form-outline mb-4">
            <input
              type="text"
              id="businessName"
              class="form-control"
              name="businessName"
            />
            <label class="form-label" for="typeText"
              >Legal Business Name</label>
          </div>

这是有效的 Django 表单：

      % if submitted %
      Your forms has been submitted
      % else %
      <form method="post">
        % csrf_token %
         form.as_p 
        <!-- Submit button -->
        <button
          type="submit"
          class="btn btn-primary btn-block mb-4"
          id="btn"
        >
          Submit
        </button>

      </form>

这里是views.py

def add_form(request):
    submitted=False
    if request.method == 'POST':
        form = infoForm(request.POST)
        if form.is_valid():
            form.save()
            return HttpResponseRedirect('/?submitted=True')
    else:
        form = infoForm()
        if 'submitted' in request.GET:
            submitted=True
    return render(request, 'template/template.html','form':form, 'submitted':submitted)

这是表格

class infoForm(ModelForm):
    class Meta:
        model = Info
        fields = ['businessName']

这是我尝试过的：

                    <div class="form-outline mb-4">
                        <input type="text" class="form-control" name="businessName" % if form.is_bound %value=" form.businessName.value "% endif %>
                        <label class="form-label">Legal Business Name</label>
                    </div>
                    % for err in form.businessName.errors %
                        <small class="text-danger mb-2 ml-2"> err </small>
                    % endfor %

我的问题： 如何使用 form.as_p 轻松保持相同的 HTML 样式？

在这种情况下，属性所需的输入是什么？

【问题讨论】：

***.com/questions/401025/…

【参考方案1】：

这将是对 django 表单应用自定义样式的最快方法，这样您就可以让 django 处理表单，同时仍然使用您喜欢的 css 样式...

摘自我对How to markup form fields with in Django的回答

class MyForm(forms.Form):
    myfield = forms.CharField(widget=forms.TextInput(attrs='class': 'myfieldclass'))

或

class MyForm(forms.ModelForm):
    class Meta:
        model = MyModel

    def __init__(self, *args, **kwargs):
        super(MyForm, self).__init__(*args, **kwargs)
        self.fields['myfield'].widget.attrs.update('class': 'myfieldclass')

或

class MyForm(forms.ModelForm):
    class Meta:
        model = MyModel
        widgets = 
            'myfield': forms.TextInput(attrs='class': 'myfieldclass'),
        

originally answered

编辑 1：添加标签样式

1 通过上述方法设置类 例如：

self.fields['some_field'].widget.attrs.update('class': 'some_class')`

2 选择该类的标签并设置样式

.that_some_class label
    font-size: large;

【讨论】：

标签怎么样，如何添加类？

在编辑中添加...请注意，该样式一次应用于所有标签。在大多数情况下都可以。如果要选择特定标签，则必须渲染每个表单属性以单独设置样式