使用 django-autocomplete-light v3 自定义项目的输出答案

【问题标题】：Customising the output of items using django-autocomplete-light v3使用 django-autocomplete-light v3 自定义项目的输出
【发布时间】：2016-12-08 13:26:51
【问题描述】：

在 django-autocomplete-light 的早期版本中，您可以使用模板来呈现每个返回的条目，其中包括插入自定义 HTML 的能力

我不知道如何使用常规 API 做到这一点，所以我正在尝试添加它。

到目前为止，我有一个这样的类，它使用mark_safe，并且正在传递 HTML：

class TemplateRenderSelect2QuerySetView(autocomplete.Select2QuerySetView):
    def get_result_label(self, result):
        """Return the label of a result."""
        template = get_template("autocomplete_light/item.html")

        context = Context({"item": result})
        return mark_safe(template.render(context))

而模板autocomplete_light/item.html是：

<b>{{ item.name }}</b>

但这被渲染为：

但是带有正确标签的 JSON 是正确的：

{"pagination": {"more": false}, "results": [{"text": "<b>Victoria</b>", "id": 11}]}

如何让 django-admin 正确呈现 HTML？

编辑：我在自定义 HTML 上找到了一些 extra documentation 并尝试针对小部件设置 attrs={'data-html': 'true'}，但它仍然无法正常工作

【问题讨论】：

标签： jquery python django django-autocomplete-light

【解决方案1】：

一如既往，答案是子类化，在这种情况下，提示是覆盖get_result_title：

class CustomisableAutocomplete(autocomplete.Select2QuerySetView):
    template_name = "autocomplete_light/item.html"

    def get_result_title(self, result):
        """Return the label of a result."""

        template = get_template(self.template_name)
        context = Context({"result": result})
        return template.render(context)

如果你想要一个没有标签的标题，你可以覆盖get_results并返回更多数据：

class CustomisableAutocomplete(autocomplete.Select2QuerySetView):
    template_name = "autocomplete_light/item.html"
    def get_result_title(self, result):
        """Return the title of a result."""
        return six.text_type(result)

    def get_result_text(self, result):
        """Return the label of a result."""

        template = get_template(self.template_name)
        context = Context({"result": result})
        return template.render(context)

    def get_results(self, context):
        """Return data for the 'results' key of the response."""
        return [
            {
                'id': self.get_result_value(result),
                'title': self.get_result_title(result),
                'text': self.get_result_text(result),
            } for result in context['object_list']
        ]

【讨论】：

【解决方案2】：

'data-html': True 在documentation 中现在可以使用了。

    study = forms.ModelChoiceField(queryset=Study.objects.all(),
                                      widget=autocomplete.ModelSelect2(
                                        url='my_studies-autocomplete',
                                        attrs={
                                            'data-placeholder': 'Please select...',
                                            'data-theme': 'bootstrap4',
                                            'data-html': True
                                        })
                                    )

【讨论】：