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

本文主要介绍了django admin search_fields placeholder 管理后台添加搜索框提示文字,分享给大家,具体如下:

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

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

$ python manage.py startapp carousel
# settings.py
```
INSTALLED_APPS = [
  ...
  'carousel',
]
```
# carousel/models.py
```
from django.db import models

class Carousel(models.Model):
  community = models.IntegerField('小区ID')

  class Meta:
    verbose_name = verbose_name_plural = '轮播设置'
```

1. 定制模板标签templatetags

mkdir -p carousel/templatetags
touch carousel/templatetags/__init__.py
touch carousel/templatetags/search_with_placeholder.py
# carousel/templatetags/search_with_placeholder.py
from django.contrib.admin.templatetags.admin_list import (
  InclusionAdminNode,
  register,
  search_form,
)

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,
  )

2. 定制模板template

mkdir -p carousel/templates/admin
mkdir -p carousel/templates/custom_admin
touch carousel/templates/admin/search_form_plus.html
touch carousel/templates/custom_admin/change_list.html
<!-- carousel/templates/admin/search_form_plus.html -->
{% 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 }}" placeholder="{{ search_placeholder }}" value="{{ cl.query }}" 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 %}" rel="external nofollow" >{% 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 %}
<!-- carousel/templates/custom_admin/change_list.html -->
{% extends "admin/change_list.html" %}
{% load search_with_placeholder %}

{% block search %}{% search_form_plus cl search_placeholder %}{% endblock %}

3. 定制admin.py

cat carousel/admin.py

# Django3.1
from django.contrib import admin

from .models import BoxCarousel, Carousel,

class PlaceholderMixin:
  change_list_template = "custom_admin/change_list.html"

  def changelist_view(self, request, extra_context=None):
    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)

@admin.register(Carousel)
class CarouselAdmin(PlaceholderMixin, admin.ModelAdmin):
  search_fields = ["=community"]
  search_placeholder = "请输入小区ID"

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

到此这篇关于django admin search_fields placeholder 管理后台添加搜索框提示文字的文章就介绍到这了,更多相关django admin search_fields placeholder搜索框内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们!

(0)

相关推荐

  • django 使用全局搜索功能的实例详解

    安装需要的包 1 第一步: 全文检索不同于特定字段的模糊查询,使用全文检索的效率更高,并且能够对于中文进行分词处理. haystack:全文检索的框架,支持whoosh.solr.Xapian.Elasticsearc四种全文检索引擎 whoosh:纯Python编写的全文搜索引擎对于小型的站点,whoosh已经足够使用 jieba:一款免费的中文分词包 1)在虚拟环境中依次安装需要的包. pip install django-haystack pip install whoosh pip in

  • Django实现组合搜索的方法示例

    一.实现方法 1.纯模板语言实现 2.自定义simpletag实现(本质是简化了纯模板语言的判断) 二.基本原理 原理都是通过django路由系统,匹配url筛选条件,将筛选条件作为数据库查询结果,返回给前端. 例如:路由系统中的url格式是这样: url(r'^article-(?P<article_type_id>\d+)-(?P<category_id>\d+).html',views.filter) 其中article_type_id和category_id和数据库中字段是

  • django组合搜索实现过程详解(附代码)

    一.简介 # 组合搜索 # 技术方向:自动化,测试,运维,前端 # 分类:Python Linux JavaScript OpenStack Node.js GO # 级别:初级 中级 高级 骨灰级 有4张表: Direction(技术方向标),Classification(技术分类表),Level(难度级别表),Video(视频表) 它们的关系是: Direction与Classification多对多关系 Video与Classification,Level是一对多关系 最终要实现的结果如下

  • Django项目之Elasticsearch搜索引擎的实例

    1.使用Docker安装Elasticsearch及其扩展 获取镜像,可以通过网络pull sudo docker image pull delron/elasticsearch-ik:2.4.6-1.0 或者加载镜像文件 sudo docker load -i elasticsearch-ik-2.4.6_docker.tar 修改elasticsearch的配置文件 elasticsearc-2.4.6/config/elasticsearch.yml第54行,更改ip地址为本机ip地址 n

  • pycharm+django创建一个搜索网页实例代码

    本文主要研究的是pycharm+django创建一个搜索网页的实例代码,具体步骤和代码示例如下. 创建工程 比如,我创建的工程目录结构如下: 命令行 进入windows命令行,进入根目录: python manage.py startapp django_web 接着你会在pycharm中发现,多了一个django_web文件夹.如下将截图: 创建一个test.html <!DOCTYPE html> <html> <head> <title>开始搜索<

  • django使用haystack调用Elasticsearch实现索引搜索

    前言: 在做一个商城项目的时候,需要实现商品搜索功能. 说到搜索,第一时间想到的是数据库的 select * from tb_sku where name like %苹果手机% 或者django的 SKU.objects.filter(name__contains="苹果手机") 但是,假如你的数据库有几千万条数据,name字段没有索引,可能查询需要十几分钟,用户可能会等你?那为什么不给name字段增加索引?商品表不仅仅是用来查询,也会经常修改数据,新增删除数据等.建立索引后,做增删

  • Python中使用haystack实现django全文检索搜索引擎功能

    前言 django是python语言的一个web框架,功能强大.配合一些插件可为web网站很方便地添加搜索功能. 搜索引擎使用whoosh,是一个纯python实现的全文搜索引擎,小巧简单. 中文搜索需要进行中文分词,使用jieba. 直接在django项目中使用whoosh需要关注一些基础细节问题,而通过haystack这一搜索框架,可以方便地在django中直接添加搜索功能,无需关注索引建立.搜索解析等细节问题. haystack支持多种搜索引擎,不仅仅是whoosh,使用solr.elas

  • Django 简单实现分页与搜索功能的示例代码

    假设现有需求如下: 需要一个页面分页展示信息,在该页面添加搜索框以提供检索功能. 那么,我们知道,展示信息和检索功能是在同一个页面,也就是共用一个路由. 代码如下: 第一步,写路由:为了清晰,这里只给出主页和展示页面的路由. urls.py: from django.urls import path from . import views from django.conf.urls.static import static from django.conf import settings fro

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

    本文主要介绍了django admin search_fields placeholder 管理后台添加搜索框提示文字,分享给大家,具体如下: 如图, Django admin后台生成的搜索框, 默认是没有提示文字的, 不够友好; 网上也没搜到什么好的示例, 于是自己动手实现了一个 0. 已经存在的app名为carousel, 大致相当于如下操作/代码 $ python manage.py startapp carousel # settings.py ``` INSTALLED_APPS =

  • Django admin禁用编辑链接和添加删除操作详解

    禁用admin中models的编辑链接和添加删除按钮 方法如下: class MyModelAdmin(models.ModelAdmin): ... List_display_links = None #禁用编辑链接 def has_add_permission(self, request): # 禁用添加按钮 return False def has_delete_permission(self, request, obj=None): # 禁用删除按钮 return False def g

  • Jquery实现搜索框提示功能示例代码

    博客的前某一篇文章中http://www.jb51.net/article/35175.htm写过一个用Ajax来实现一个文本框输入的提示功能.最近在一个管理项目的项目中,使用后发现,真的反应很慢,数据量很大的情况下使用Ajax去实现真的不合适,于是,我又写了一个使用Jquery来实现方法. 废话不多说,上图上代码:  引用方式: 复制代码 代码如下: <body style="background-color: White;"> <form id="for

  • php 搜索框提示(自动完成)实例代码

    百度的搜索大家都在用,当用户输入文字时,搜索框下面自动提示相关的信息,加强了用户体验,的确不错,那么这个效果是如何实现的呢 先看一下效果图吧,这样更有动力,要不然大家还不知道我在讲什么,到底要达到什么样的效果! 下面先主要讲解原理: 在search.html页面中,用户在搜索框内输入"j"时,使用javascript获取搜索框的文本内容,到数据库中查找相关的内容并返回,再使用javascript将服务器返回的结果显示在搜索框下面的提示框内,供用户参考选择. 具体的实现方法: 首先在页面

  • jquery实现非叠加式的搜索框提示效果

    以前一直在用JQUERY叠加两个INPUT框来实现登陆中需要输入的用户名.密码来实现提示与用户的输出,这边采用JQUERY在一个INPUT框中实现这种效果,具体做法为: 下面是INPUT框代码: 复制代码 代码如下: <input class="search_text" type="text" value="搜索" name="searchText" /> 下面是JQUERY代码: 复制代码 代码如下: //设置搜

  • Android中如何实现清空搜索框的文字

    需求:项目中的有关搜索的地方,加上清空文字的功能,目的是为了增加用户体验,使用户删除文本更加快捷 解决过程:开始的时候感觉这个东西不太好实现,主要就是布局的问题,可能是开始顾虑的太多了,再加上当时产品催的不太紧,而且这个功能也不是必须实现的.但是今天不一样了,这个是老大让加上的,说别的很多应用中都有这个功能,没办法那就加上呗,试着去使用了相对布局去实现,把一个删除按键放在编辑框的右上方,当文字的时候就把删除按键给显示出来,当编辑框为空的时候就把删除按键给隐藏掉.布局代码 <?xml versio

  • 在django admin详情表单显示中添加自定义控件的实现

    在开发中有需求在详情显示里外键字段内容,并且添加按钮弹窗内容,以及按钮跳转内容. 以前并没有做过相似的开发,我们的后台是xadmin,当时正在研究xadmin的插件,于是想着能不能用插件去做,后来发现太麻烦,而且实现起来我也没研究通,主要是添加按钮之类的没搞懂,于是就换了一种简单的方法. 首先先讲解下思路,admin中有几个界面,一个是展示的list界面,一个是详情的model界面,model中其实就是详情detail,里面记录了此条数据的全部内容,精简来说就是一个form表单的内容展示. 那么

  • 屏蔽Django admin界面添加按钮的操作

    例如,我想去掉某个Model界面的增加按钮,如下图所示: 一般的做法是修改 template,但是,有没有更简便易行的方法呢?答案是肯定的. 只需要修改admin.py中对应的 ModelAdmin 即可. 下面是本人修改的代码: 补充知识:Django admin 列表每行后面添加审核按钮 我就废话不多说了,还是直接看代码吧! def pass_audit_str(self): parameter_str = 'id={}&status={}'.format(str(self.id), str

  • iOS开发实现搜索框(UISearchController)

    最近自己在写一个APP,其中需要实现搜索框搜索功能,于是乎就想写篇博客介绍下UISearchController和搜索框的实现. 我写的是一个天气预报APP,直接以我APP中的源代码来详细介绍下搜索框的实现. 注:在iOS 8.0以上版本中, 我们可以使用UISearchController来非常方便地在UITableView中添加搜索框. 而在之前版本中, 我们还是必须使用UISearchBar + UISearchDisplayController的组合方式. 初始化UISearchCont

  • jquery 模拟类搜索框自动完成搜索提示功能(改进)

    autopoint.js代码: 复制代码 代码如下: /* * @date: 2010-5-22 21:42:15 * @author: 胡灵伟 * Depends: * jquery.js * * function:类似GOOGLE搜索框提示功能 */ (function($) { $.fn.autopoint = function (options) { defaults = { url:options.url, keyLeft : 37,//向左方向键 keyUp : 38,//向上方向键

随机推荐