使用 html5 输入类型='颜色'

Question

我有模特

# models.py
from django.db import models
    
class Foo(models.Model):
    # ...
    color = models.CharField(max_length=7, null=True)

color 应该存储一个十六进制颜色。而不是input type="text"，我想使用html5 input type "color"。

我通过设置以下表单对象进行了尝试：

# forms.py
from django.forms import ModelForm, CharField

class FooForm(ModelForm):
    class Meta:
        model = Foo
        widgets = {
                   'color': CharField(attrs={'type': 'color'}),
                   }

但是，这给了我以下错误消息

init() 得到了一个意外的关键字参数“attrs”

我做错了什么，我该如何做对？

Answer 1

自己解决了。它几乎像我预期的那样工作：

# models.py
from django.db import models

class Foo(models.Model):
    # ...
    color = models.CharField(max_length=7, null=True)

# forms.py
from django.forms import ModelForm
from django.forms.widgets import TextInput

class FooForm(ModelForm):
    class Meta:
        model = Foo
        widgets = {
                   'color': TextInput(attrs={'type': 'color'}),
                   }

对我来说棘手的部分是不要忘记在视图中正确设置它：

# views.py
from my_app.models import Foo
from my_app.forms import FooForm

class FooCreate(CreateView):
    model = Foo
    form_class = FooForm

感谢aamir-adnan - 他指出我必须使用 TextInput 而不是 CharField。

Answer 2

如果您只需要更新 type attr，则需要更新小部件 attrs，它是 TextInput for CharField：

class FooForm(ModelForm):
    def __init__(self, *args, **kw):
        super(FooForm, self).__init__(*args, **kw)
        self.fields['color'].widget.attrs.update({
            'type': 'color',
        })

    class Meta:
        model = Foo