如何爲django admin搜索search_fields添加搜索框提示文字?

微信截圖_20210812122620.png

如上圖所示django admin在ModelAdmin中添加search_fields便可顯示一個搜索框,可是不能設置搜索框的提示文字,在實際開發中要讓使用的人知道輸入什麼能夠進行快速檢索,是一個快速提高用戶體驗的方法,在網上找了不少,也沒有很好的解決這個問題,今天咱們就動手實現一個!html

我這裏已經經過下方命令建立了一個名爲dadmin的apppython

python manage.py startapp dadmin
複製代碼

在dadmin目錄下新建一個templatetags的文件夾,而且在其內部建立一個search_with_placeholder.py的文件,內部代碼以下:git

# dadmin/templatetags/search_with_placeholder.py

from django.contrib.admin.templatetags.admin_list import (register, search_form)
from django.contrib.admin.templatetags.base import InclusionAdminNode


def search_form_plus(cl, search_placeholder: str = ""):
    """ Display a search form for searching the list with placeholder. """
    return dict(search_form(cl), search_placeholder=search_placeholder)


@register.tag(name='search_form_plus')
def search_form_tag(parser, token):
    return InclusionAdminNode(parser, token, func=search_form_plus, template_name='search_form_plus.html', takes_context=False)
複製代碼

在與項目同級別,也就是根目錄,建立一個templates的目錄,再在其內部建立一個admin文件夾,重寫admin的任何默認模板只須要放到這個文件夾便可,這也是修改django admin默認模板最簡便的方法,咱們在其內部建立一個search_form_plus.html的文件,內部代碼以下:web

{% load i18n static %}
{% if cl.search_fields %}
<div id="toolbar"><form id="changelist-search" method="get">
<div><!-- DIV needed for valid HTML -->
<label for="searchbar"><img src="{% static "admin/img/search.svg" %}" alt="Search"></label>
<input type="text" size="40" name="{{ search_var }}" value="{{ cl.query }}" placeholder="{{ search_placeholder }}" id="searchbar" autofocus>
<input type="submit" value="{% translate 'Search' %}">
{% if show_result_count %}
    <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>
{% endif %}
{% for pair in cl.params.items %}
    {% if pair.0 != search_var %}<input type="hidden" name="{{ pair.0 }}" value="{{ pair.1 }}">{% endif %}
{% endfor %}
</div>
</form></div>
{% endif %}
複製代碼

再在dadmin目錄下建立一個templates/dadmin的文件夾路徑,再在其內部建立一個change_list.html的文件,內部代碼以下:django

<!-- 完整文件路徑,這是註釋,模板中能夠刪掉 dadmin/templates/dadmin/change_list.html -->

{% extends 'admin/change_list.html' %}
{% load search_with_placeholder %}
{% block search %}{% search_form_plus cl search_placeholder %}{% endblock %}
複製代碼

以後在dadmin目錄中的admin.py中定義一個全部ModelAdmin的基礎類BaseAdmin,之後全部用到ModelAdmin的地方咱們都繼承BaseAdmin便可,代碼以下:api

class BaseAdmin(admin.ModelAdmin):
	change_list_template = "dadmin/change_list.html"
	
	def changelist_view(self, request, extra_context=None):
        # 列表視圖, 添加search_placeholder = ""
        # 便可定義搜索框的值,也能夠向列表頁得傳進任何數據
        search_placeholder = getattr(self, "search_placeholder", False)
        if search_placeholder:
            extra_context = extra_context or {}
            extra_context["search_placeholder"] = search_placeholder
        return super().changelist_view(request, extra_context=extra_context)
複製代碼

使用也很是簡單,全部的ModelAdmin都只須要繼承他便可,以下例所示:微信

class CategoryModelAdmin(BaseAdmin):
    """ 分類管理配置 """

    list_display = ('id', 'name', 'is_show', 'cate_icon',
                    'sort',  'add_date', 'operate')
    search_fields = ('name',)  # 設置搜索框
    search_placeholder = '請輸入分類名稱搜索'  # 設置搜索框的提示文字

admin.site.register(CategoryModel, CategoryModelAdmin)
複製代碼

其餘列表頁也須要設置搜索框文字,繼承BaseAdmin便可,很是簡單,直接拿去使用吧!markdown

相關源代碼請參考:gitee.com/xingfugz/dj…app

若是你也在學習Django,那麼歡迎點贊 評論交流學習,歡迎star以上項目,給個鼓勵,也歡迎您能關注個人公衆號「幸福關中」,一塊兒學習交流,上邊有不少學習資料哦!svg