时间戳

首页 > 解决方案 > Django 模板中的表单自定义

python - Django 模板中的表单自定义

问题描述

我想为下面的表单添加样式（主要目标是更改占位符的文本颜色，因为我的表单是深色的，并且占位符由于其默认的灰色而不可见）我确信必须有某种方法来实现这仅在模板中。

来自 CSS 的片段

 ::placeholder {
      color: aquamarine;
      opacity: 1;
    }

来自模板的片段

<form action="{% url 'register' %}" class="box" method="POST">
  <input type="text" name="username" placeholder="{{form.username.label}}" id=""/>
  <input type="text" name="firstname" placeholder="{{form.first_name.label}}" id="" />
  <input type="text" name="lastname" placeholder="{{form.last_name.label}}" id=""/>
  <input type="text" name="email"placeholder="{{form.email.label}}"id="" />
  <input type="text" name="password1" placeholder="{{form.password1.label}}" id=""/>
  <input type="text" name="password2" placeholder="{{form.password2.label}}" id=""/>
  <input type="submit" value="Submit" />
</form>

这是我为添加新用户（django.contrib.auth.models 用户）而创建的表单。我不确定如何{{form.username}}在现有表单中使用。如果我只是简单地将其放入{{form.username}}表单中，它会创建一个没有应用任何样式的新字段。

标签： pythondjangodjango-modelsdjango-forms

解决方案

我为这个问题找到了一个肮脏的解决方案。我第一次输入的表格如下所示 -

<form action="{% url 'register' %}" class="box" method="POST">
{{form.username}}
{{form.first_name}}
...
</form>

然后我检查了渲染的模板并窃取了上述代码的 HTML 等价物。我在输入标签中添加了所有必需的属性。它看起来像下面的片段 -

      {% csrf_token%}
      <input
        type="text"
        name="username"
        maxlength="150"
        **placeholder="Username"**
        autofocus=""
        required=""
        id="id_username"
      />

      <input
        type="text"
        name="first_name"
        maxlength="30"
        **placeholder="First Name"**
        id="id_first_name"
      />
...

我知道这可能不是一个完美的解决方案，必须有一种更优雅的方式来处理这种情况。但是，我暂时继续采用这种方法，因为它是服务于目的的。

推荐阅读