环境:xadmin-for-python3 python3.5.2 django1.9.12

列表页的searchbar如果提供的可搜索字段,都没提示哪个字段可搜索,很不友好,本次定制主要增加input元素的placeholder,定制后见搜索区的提示效果:

以下为要修改的相关代码:

1. xadmin\plugins\filters.py block_nav_form方法增加search_placeholder

def block_nav_form(self, context, nodes):
if self.search_fields:
search_placeholder = ' '.join([str(get_fields_from_path(self.model, search_field)[-1]._verbose_name) for search_field in self.search_fields])
context = get_context_dict(context or {}) # no error!
context.update({
'search_var': SEARCH_VAR,
'remove_search_url': self.admin_view.get_query_string(remove=[SEARCH_VAR]),
'search_form_params': self.admin_view.get_form_params(remove=[SEARCH_VAR]),
'search_placeholder': search_placeholder
})
nodes.append(
loader.render_to_string(
'xadmin/blocks/model_list.nav_form.search_form.html',
context=context)
)

2.  xadmin\templates\xadmin\blocks\model_list.nav_form.search_form.html 增加search_placeholder

{% load i18n %}
{% if cl.search_fields %}
<form class="navbar-form navbar-left" action="" method="get">
<div class="input-group search-group">
{% if cl.search_query %}
<span class="input-group-btn"><a class="btn btn-default" href="{{remove_search_url}}">x</a></span>
{% endif %}
<input id="searchbar" class="form-control" style="width:300px" type="text" name="{{ search_var }}" value="{{ cl.search_query }}" placeholder="{% trans 'Search' %} {{search_placeholder}}">
<span class="input-group-btn"><button class="btn btn-primary" type="submit"><i class="fa fa-search"></i></button></span>
</div>
{{ search_form_params|safe }}
</form>
{% endif %}

django-xadmin定制之列表页searchbar placeholder的更多相关文章

  1. [py][mx]django模板继承-课程列表页

    课程列表页分析 1,机构类型 2,所在地区 3.排序 学习人数 先分析下 纵观页面,页头页脚都一样. django提供了模板继承. 至少 不同页面的title 面包屑路径 content内容不一致,以 ...

  2. django xadmin 插件(3) 列表视图新增自定义按钮

    效果图: 编辑按钮是默认的list_editable属性对应的插件(xadmin.plugins.editable) 放大按钮对应的是自定义插件. 自定义按钮源码: xplugin.py(保证能够直接 ...

  3. django xadmin 插件(2) 列表视图新增一功能列

    以默认的related_link为例(即最后一列). 源码:xadmin.plugins.relate.RelatedMenuPlugin class RelateMenuPlugin(BaseAdm ...

  4. 6- vue django restful framework 打造生鲜超市 -完成商品列表页(下)

    Vue+Django REST framework实战 搭建一个前后端分离的生鲜超市网站 Django rtf 完成 商品列表页下 drf中的request和response drf对于django的 ...

  5. 第三百九十六节,Django+Xadmin打造上线标准的在线教育平台—其他插件使用说,自定义列表页上传插件

    第三百九十六节,Django+Xadmin打造上线标准的在线教育平台—其他插件使用说,自定义列表页上传插件 设置后台列表页面字段统计 在当前APP里的adminx.py文件里的数据表管理器里设置 ag ...

  6. 第三百八十八节,Django+Xadmin打造上线标准的在线教育平台—网站列表分页

    第三百八十八节,Django+Xadmin打造上线标准的在线教育平台—网站列表分页 分页可以用一个第三方分页模块django-pure-pagination 下载地址:https://github.c ...

  7. 12、Django实战第12天:课程机构列表页数据展示

    今天完成的是课程机构列表页.... 1.启动服务,进入xadmin后,添加5个城市信息用作测试数据 2.添加课程机构,其中有一项要上传封面图的地方要注意 封面图上传路径是我们在models中设置好的 ...

  8. [django]详情页列表页

    详情页列表页 列表页展示titile--这个模型的部分字段 详情页展示这个模型的所有字段 我想看下related_name这个从主表取子表数据 取数据--官网投票例子 https://docs.dja ...

  9. 第三百八十九节,Django+Xadmin打造上线标准的在线教育平台—列表筛选结合分页

    第三百八十九节,Django+Xadmin打造上线标准的在线教育平台—列表筛选结合分页 根据用户的筛选条件来结合分页 实现原理就是,当用户点击一个筛选条件时,通过get请求方式传参将筛选的id或者值, ...

随机推荐

  1. ZBrush笔刷属性栏简介

    在笔刷的属性栏当中,最先要了解和掌握的就是Zadd和Zsub两个按钮,当激活Zadd按钮时,我们雕刻的形态向屏幕外突出:当激活Zsub时,我们雕刻的形体就会向屏幕内凹陷.如果在激活Zadd按钮时,雕刻 ...

  2. appium ios端自动化测试配置

    一.安装环境介绍macOS 10.12.4 Xcode 8.3.2 适用机型:iOS9 及以上机型 二.Appium源码安装Xcode升级8.2之后不再支持UIAutomation,转而使用XCUIT ...

  3. 【BZOJ4940】【YNOI2016】这是我自己的发明

    阅读此篇文章前请先跟我大喊三声:dllxl!dllxl!dllxl! 咳咳. 题意: Description 给一个树,n 个点,有点权,初始根是 1. m 个操作,每次操作: 1. 将树根换为 x. ...

  4. go语言简单的执行shell命令

    package main import(     "fmt"     "os/exec"     "os"     "string ...

  5. 微信小程序 上传图的功能

    首先选择图片,然后循环,再就是在点击发布的时候循环图片地址赋值,包括删除命令 js代码: //选择图片 uploadImgAdd: function(e) { var imgs = this.data ...

  6. Qt之字体文件(TTF)

    简述 TTF(TrueTypeFont)是Apple公司和Microsoft公司共同推出的字体文件格式,随着windows的流行,已经变成最常用的一种字体文件表示方式. 在一些特殊的场合,系统字符集不 ...

  7. linux线程间同步(1)读写锁

    读写锁比mutex有更高的适用性,能够多个线程同一时候占用读模式的读写锁.可是仅仅能一个线程占用写模式的读写锁. 1. 当读写锁是写加锁状态时,在这个锁被解锁之前,全部试图对这个锁加锁的线程都会被堵塞 ...

  8. [PHP]怎样在SAE的CodeIgniter项目中隐藏掉index.php

    第一步:改动项目根文件夹的config.yaml文件.加入例如以下内容: handle: - rewrite: if(!is_dir() && !is_file() && ...

  9. Eclipse中项目进行发布到Tomcat中的位置

    Eclips配置tomcat默认是发布到.metadate\plugins\目录下的,wtpwebapps.这样在实际的tomcat目录下,就找不到发布的项目.我们可以自己进行设置,在控制栏中找到se ...

  10. cpc,tank

    先保存一段错误的代码 #include<iostream> #include<cstdio> #include<cstring> #include<algor ...