一、引子

  在我们浏览很多页面时,会发现一般情况下都有一个分类的功能,而且还是多个类别同时控制,这就是多级过滤。如下图:

  一行代表一个类别,第一行就是展示了所有的出版社,选中后就会以出版社分类,第二行就是以作者分类,当都选择了,就共同控制。此时选中了‘人民出版社’和‘余华’,数据就会以这两者共同过滤,当我们选择作家出版社时,人民出版社就会被取消,当我们选择某一类的all时,这一类的其他被选中的就会被取消。

  首先在starkmodel有个filter_list列表,这个是包含总共有哪些类别。

  二、代码

  从要实现的效果来看,除了每行的第一个,其他所有的都应该是a标签。如果是单级过滤的话,每个a标签的路径可以写死。但现在是多级过滤,a标签的路径就只能是动态的,所谓的动态,无非是在自己的固有过滤条件上再加上已经选中的其他类别的过滤条件。效果是这样的。当我们第一次进入页面时,没有选中任何过滤条件,每个a标签就是自己的固有过滤条件;当我们点击‘人民出版社’时,就发送了请求,此时后台就要重构a标签的路径了,出版社下的a标签不用改动,作者下的a标签就要在自己的固有过滤条件下加上本次请求的过滤条件,这样才能在点击‘余华’的时候既有‘人民出版社’,还会有‘余华’两个过滤条件。

  每一行的all就是把跟自己属于同一类的过滤条件给去掉就行了。

  sites.py:

  1. class Show(object):
  2. def show_filter(self):
  3. filter_dict={}
  4. for field in self.config_obj.filter_list: #循环配置类的filter_list,取出需要进行分类的字段
  5. filter_list = []
  6. params=copy.deepcopy(self.request.GET) #params是本次请求的条件
  7. if params.get('page'): #这是把页码的过滤条件给去了
  8. params.pop('page')
  9. if params.get(field): #这是把当前字段的过滤条件给去了,因为params要给all使用
  10. params.pop(field)
  11. filter_list.append('<a class="btn-sm btn-default" href="?%s">all</a>'%params.urlencode()) #这是构造每一行的all标签
  12. field_obj=self.config_obj.model._meta.get_field(field) #filter_list列表里面存放的是字符串,通过这方法拿到字符串对应的字段对象
  13. if field_obj.choices: #字段对象存在是choices,直接拿就行
  14. data=field_obj.choices #此时得到的数据是元祖套元祖类型的
  15. else: #该字段对象不存在choices
  16. rel_model=field_obj.remote_field.model #拿到该字段对象对应的模型类
  17. data=rel_model.objects.all() #得到的数据就是模型类的所有对象
  18. for obj in data:
  19. if type(obj) == tuple: #如果是元祖类型,直接解包
  20. pk,text=obj
  21. else: #如果不是元祖类型,说明是一个对象,我们拿到对象的pk值和名字就行
  22. pk,text=obj.pk,obj
  23. params[field]=pk #我们把pk值放入到params中去
  24. if self.request.GET.get(field)==str(pk): #构造all后面的a标签
  25. filter_list.append('<a class="btn-sm btn-default active" href="?%s">%s</a>'%(params.urlencode(),text))
  26. else:
  27. filter_list.append('<a class="btn-sm btn-default" href="?%s">%s</a>'%(params.urlencode(), text))
  28. filter_dict[field]=filter_list
  29. return filter_dict
  30.  
  31. -------------------------------得到的filter_dict-----------------------------------------------------------------

{'publish': ['<a class="btn-sm btn-default" href="?author=2">all</a>', '<a class="btn-sm btn-default active" href="?author=2&publish=1">人民出版社</a>', '<a class="btn-sm btn-default" href="?author=2&publish=2">作家出版社</a>', '<a class="btn-sm btn-default" href="?author=2&publish=3">天天出版社</a>']}
{'publish': ['<a class="btn-sm btn-default" href="?author=2">all</a>', '<a class="btn-sm btn-default active" href="?author=2&publish=1">人民出版社</a>', '<a class="btn-sm btn-default" href="?author=2&publish=2">作家出版社</a>', '<a class="btn-sm btn-default" href="?author=2&publish=3">天天出版社</a>'], 'author': ['<a class="btn-sm btn-default" href="?publish=1">all</a>', '<a class="btn-sm btn-default" href="?publish=1&author=1">路遥</a>', '<a class="btn-sm btn-default active" href="?publish=1&author=2">余华</a>', '<a class="btn-sm btn-default" href="?publish=1&author=3">杨绛</a>']}

  前端页面代码:

  1. <div class="filter">
  2. {% if show.config_obj.filter_list %}
  3. {% for field,obj_list in show.show_filter.items %}
  4. <span class="btn btn-success">{{ field }}</span>
  5. {% for obj in obj_list %}
  6. {{ obj|safe }}
  7. {% endfor %}
  8. <br>
  9. {% endfor %}
  10. {% endif %}
  11. </div>

stark组件之多级过滤的更多相关文章

  1. stark组件之创建

    stark组件之需求 仿照Django中的admin , 开发了自己的stark组件,实现类似数据库客户端的功能,对数据进行增删改查 . stark之创建 1.在项目中 创建stark应用,app01 ...

  2. django-admin 仿写stark组件action,filter筛选过滤,search查询

    写在StandLi里面的方法都是通过ModelSubject这个类里面的stand_li方法,在它里面用StandLi这个类实例化出来一个对象,这个实例化出来的对象把数据传给前端HTML模板进行渲染, ...

  3. day 69crm(6) stark组件 action 和 多层过滤效果

      前情提要: 今天学的是stark 组件的 action  和多层过效果 一: action (自定制函数多选功能效果) 1: 学习 观点明确:     2: 多选效果前端和后端进行的操作   2& ...

  4. 【django之stark组件】

    一.需求 仿照django的admin,开发自己的stark组件.实现类似数据库客户端的功能,对数据进行增删改查. 二.实现 1.在settings配置中分别注册这三个app # Applicatio ...

  5. django 之 stark组件

    ----------------------------------------------------------------烦恼没完没了,内心动荡不安,呜呼哀哉. 一.有个特殊的需求,需要用sta ...

  6. 24.stark组件全部

    admin组件: 博客里面的图片的是在太难弄了,有大哥会弄给我贴一片博客,我一个一个加太累了,没有加 admin参考:https://www.cnblogs.com/yuanchenqi/articl ...

  7. stark组件的分页,模糊查询,批量删除

    1.分页组件高阶 2.整合展示数据showlist类 3.stark组件之分页 3.stark组件之search模糊查询 4.action批量处理数据 4.总结 1.分页组件高阶 1.分页的class ...

  8. stark组件之分页【模仿Django的admin】

    我们的stark组件用的我们的分页组件,没有重新写 下面直接看下分页的代码 class page_helper(): def __init__(self, count, current_page, p ...

  9. stark组件之搜索【模仿Django的admin】

    一.先看下django的admin是如何做搜索功能的 配置一个search_fields的列表就可以实现搜索的功能 class testbook(admin.ModelAdmin): # 第一步,定义 ...

随机推荐

  1. 别人的Linux私房菜(23)软件安装RPM、SRPM、YUM

    RPM(RedHat Package Manager),不同Linux发行版发布的RPM文件甚至不同版本,不通用. SRPM为Source RPM,所提供的软件内容没有经过编译,格式为xxx.src. ...

  2. Linux下 刚安装完mysql 修改密码

    在Centos中安装MySQL后默认的是没有root密码的,默认的是回车, 那么为了方便需要修改密码. 没有密码为MYSQL加密码: mysql -uroot -p 回车 提示输入密码,为空回车 up ...

  3. Codeforces Round #539 (Div. 2) 异或 + dp

    https://codeforces.com/contest/1113/problem/C 题意 一个n个数字的数组a[],求有多少对l,r满足\(sum[l,mid]=sum[mid+1,r]\), ...

  4. IntelliJ IDEA 2017版 spring-boot2.0.2 搭建 JPA springboot DataSource JPA sort排序方法使用方式, 添加关联表的 order by

    1.sort可以直接添加在命名格式的字段中 List<BomMain> findAllByDeleted(Integer deleted, Sort sort); 2.可以作为pageab ...

  5. valgrind内存检测工具

    valgrind 那点事 ---------------------------------------内存检测工具 valgrind要使用此工具,可以使用--tool=memcheck 在Valgr ...

  6. 【repost】JavaScript 基本语法

    JavaScript 基本语法,JavaScript 引用类型, JavaScript 面向对象程序设计.函数表达式和异步编程 三篇笔记是对<JavaScript 高级程序设计>和 < ...

  7. 《mysql必知必会》学习_第18章_20180807_欢

    第18章 全文本搜索 P121  #创建一个新表,对表的列进行定义,定义之后,MySQL自动维护该索引# create table productnotes ( note_id  int   NOT ...

  8. bootstrap的化妆页面

    Glyphicons 字体图标 所有可用的图标 包括260个来自 Glyphicon Halflings 的字体图标.Glyphi cons Halflings 一般是收费的,但是他们的作者允许 Bo ...

  9. 【转】vim 命令

    Vim命令合集 建议直接看原文:(排版有些乱) 命令历史 以:和/开头的命令都有历史纪录,可以首先键入:或/然后按上下箭头来选择某个历史命令. 启动vim 在命令行窗口中输入以下命令即可 vim 直接 ...

  10. shell 文件操作

      序   在linux平台下开发,我们经常会接触到一些任务性质的工作,而处理方式多样化.现积累各个案例.   从远程服务器拉取文件到本地服务器   scp work@cp01-xx-dev.com: ...