django admin search_fields placeholder 管理后台添加搜索框提示文字

 

如图, Django admin后台生成的搜索框, 默认是没有提示文字的, 不够友好; 网上也没搜到什么好的示例, 于是自己动手实现了一个

0. 已经存在的app名为carousel, 大致相当于如下操作/代码


  
  1. $ python manage.py startapp carousel
  2. # settings.py
  3. ```
  4. INSTALLED_APPS = [
  5. ...
  6. 'carousel',
  7. ]
  8. ```
  9. # carousel/models.py
  10. ```
  11. from django.db import models
  12. class Carousel(models.Model):
  13. community = models.IntegerField('小区ID')
  14. class Meta:
  15. verbose_name = verbose_name_plural = '轮播设置'
  16. ```

1. 定制模板标签templatetags


  
  1. mkdir -p carousel/templatetags
  2. touch carousel/templatetags/__init__.py
  3. touch carousel/templatetags/search_with_placeholder.py

  
  1. # carousel/templatetags/search_with_placeholder.py
  2. from django.contrib.admin.templatetags.admin_list import (
  3. InclusionAdminNode,
  4. register,
  5. search_form,
  6. )
  7. def search_form_plus(cl, search_placeholder: str = ""):
  8. """
  9. Display a search form for searching the list with placeholder.
  10. """
  11. return dict(search_form(cl), search_placeholder=search_placeholder)
  12. @register.tag(name="search_form_plus")
  13. def search_form_tag(parser, token):
  14. return InclusionAdminNode(
  15. parser,
  16. token,
  17. func=search_form_plus,
  18. template_name="search_form_plus.html",
  19. takes_context=False,
  20. )

2. 定制模板template


  
  1. mkdir -p carousel/templates/admin
  2. mkdir -p carousel/templates/custom_admin
  3. touch carousel/templates/admin/search_form_plus.html
  4. touch carousel/templates/custom_admin/change_list.html

  
  1. <!-- carousel/templates/admin/search_form_plus.html -->
  2. {% load i18n static %}
  3. {% if cl.search_fields %}
  4. <div id="toolbar"><form id="changelist-search" method="get">
  5. <div><!-- DIV needed for valid HTML -->
  6. <label for="searchbar"><img src="{% static "admin/img/search.svg" %}" alt="Search"></label>
  7. <input type="text" size="40" name="{{ search_var }}" placeholder="{{ search_placeholder }}" value="{{ cl.query }}" id="searchbar" autofocus>
  8. <input type="submit" value="{% translate 'Search' %}">
  9. {% if show_result_count %}
  10. <span class="small quiet">{% blocktranslate count counter=cl.result_count %}{{ counter }} result{% plural %}{{ counter }} results{% endblocktranslate %} (<a href="?{% if cl.is_popup %}_popup=1{% endif %}">{% if cl.show_full_result_count %}{% blocktranslate with full_result_count=cl.full_result_count %}{{ full_result_count }} total{% endblocktranslate %}{% else %}{% translate "Show all" %}{% endif %}</a>)</span>
  11. {% endif %}
  12. {% for pair in cl.params.items %}
  13. {% if pair.0 != search_var %}<input type="hidden" name="{{ pair.0 }}" value="{{ pair.1 }}">{% endif %}
  14. {% endfor %}
  15. </div>
  16. </form></div>
  17. {% endif %}

  
  1. <!-- carousel/templates/custom_admin/change_list.html -->
  2. {% extends "admin/change_list.html" %}
  3. {% load search_with_placeholder %}
  4. {% block search %}{% search_form_plus cl search_placeholder %}{% endblock %}

3. 定制admin.py

cat carousel/admin.py
 

  
  1. # Django3.1
  2. from django.contrib import admin
  3. from .models import BoxCarousel, Carousel,
  4. class PlaceholderMixin:
  5. change_list_template = "custom_admin/change_list.html"
  6. def changelist_view(self, request, extra_context=None):
  7. search_placeholder = getattr(self, "search_placeholder", False)
  8. if search_placeholder:
  9. extra_context = extra_context or {}
  10. extra_context["search_placeholder"] = search_placeholder
  11. return super().changelist_view(request, extra_context)
  12. @admin.register(Carousel)
  13. class CarouselAdmin(PlaceholderMixin, admin.ModelAdmin):
  14. search_fields = ["=community"]
  15. search_placeholder = "请输入小区ID"

其他列表页, 如果也想显示提示文字, 只需继承PlaceholderMixin, 然后定义search_placeholder就可以了

文章来源: blog.csdn.net,作者:waketzheng,版权归原作者所有,如需转载,请联系作者。

原文链接:blog.csdn.net/jaket5219999/article/details/115029520

(完)