我正在尝试从 Django Select 2 创建多选框 字段图书馆如下图?我使用了下一个代码,但它返回简单的选择多个小部件。我想我忘了补充一些东西。我的错误在哪里?谁能告诉我如何正确创建这样的字段?
我使用:
django-select-2 版本:5.1.0
JQuery 版本:3.1.1
表单.py:
class ProductForm(forms.ModelForm):
company = forms.ModelMultipleChoiceField(queryset=Company.objects.none())
class Meta:
model = Product
fields = ('company ',)
widgets = {
'company': Select2MultipleWidget()
}
def __init__(self, all_companies, *args, **kwargs):
super(ProductForm, self).__init__(*args, **kwargs)
self.fields['company'].queryset = all_companies
模板:
{% block style %}
{{ form.media.css }}
{% endblock %}
{% load widget_tweaks %}
<form method="post" action="">
{% csrf_token %}
<div class="modal-body">
{% for field in product_form %}
<div class="form-group{% if field.errors %} has-danger{% endif %}">
<label class="form-control-label" for="{{ field.id_for_label }}">{{ field.label }}</label>
{% render_field field class="form-control" %}
{% for error in field.errors %}
<div class="form-control-feedback">{{ error }}</div>
{% endfor %}
</div>
{% endfor %}
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="submit" class="btn btn-primary">Create</button>
</div>
</form>
{% block script %}
{{ form.media.js }}
{% endblock %}
JS:
$(function () {
var loadForm = function () {
var btn = $(this);
$.ajax({
url: btn.attr("data-url"),
type: 'get',
dataType: 'json',
beforeSend: function () {
$('#id_company').djangoSelect2({multiple: true});
$("#modal").modal("show");
},
success: function (data) {
$("#modal .modal-content").html(data.html_product_form);
}
});
};
$("#product-add-button").click(loadForm);
});
最佳答案
这是一个想法。我觉得你需要自己用Django-Select2提供的jquery插件来初始化。关注Django-Select2 docs和 Select2 docs ,您可能需要执行以下操作:
$('.django-select2').djangoSelect2({multiple: true});
关于jquery - 如何在 Django 中创建多选框?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43917791/