目的是让下拉工作。
将整个Model / ModelForm作为{{ form }}
输入html模板时通常没有问题
下面的html代码片段是我的目标,但我不想使用{{ form }}
,我想提供子集{{ form.car_model_make }}
并让Django自动创建所有选项<option value="BWM">BMW</option>
...等
# models.py
class Product(models.Models):
car_model_make = models.CharField(default='B', max_length=1, blank=True, choices=CAR_TYPE)
status_is_secondhand = models.BooleanField(blank=True)
# forms.py
class ProductForm(ModelForm):
class Meta:
model = Product
fields = ('__all__')
# views.py
class ProductFormView(FormView):
form_class = ProductForm
def form_valid(self, form):
form.save()
return super().form_valid(form)
def get_success_url(self):
return reverse('index')
# urls.py
urlpatterns = [
path('', index, name='index'),
path('product/', ProductFormView.as_view(template_name='product/product.html'), name='product'),
]
选择CAR_TYPE是包含“宝马,梅赛德斯,奥迪”的列表。
试图实现这一目标:
当我更换:
<option value="BWM">BWM</option>
<option value="Mercedes">Mercedes</option>
<option value="Audi">Audi</option>
在下面的HTML代码段中
{{ form.car_model_make }}
我收到“未找到结果”
同
<option> {{ form.car_model_make }} </option>
我得到了一个选择列表(宝马,梅赛德斯,奥迪),但它们是不可选择的
然而,随着
<option {{ form.car_model_make }} </option>
它工作但我得到一个警告标签启动没有关闭。如果我关闭标签,我会在下拉列表中打印标签字符“>”。
同样的结果是:<option value=" {{ form.car_model_make }} "></option>
我在黑暗中,试错法并没有给我理想的解决方案。我该怎么做?
<!DOCTYPE html>
<html>
<head>
<title>Bootstrap Example</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/css/select2.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/js/select2.min.js"></script>
</head>
<body>
<div class="container">
<div class="col-sm-12 mg-t-10 mg-sm-t-0">
<select class="form-control select2"
style="width: 100%;"
data-placeholder="Choose Car Make"
>
<option value="BWM">BWM</option>
<option value="Mercedes">Mercedes</option>
<option value="Audi">Audi</option>
</select>
</div>
</div>
</body>
</html>
似乎有两个步骤来获得您正在寻找的东西。
而不是替换选项,用{{ form.car_model_make }}
替换整个选择
在Django的ModelForm documentation之后,您可以覆盖窗口小部件以自定义外观,类似于以下内容:
widgets = {
'car_model_make': Select(attrs={
'class':"form-control select2",
'style':"width: 100%;",
'data-placeholder':"Choose Car Make"}),
}