EN,到这个阶段,基本功能算是完成了。

使用了jQuery cxSelect这个插件。

http://code.ciaoca.com/jquery/cxselect/

相关代码如下:

html:

<form class="uk-form" name="filter-form">
    <div id="element_id">
      项目:<select class="Site_name" name="Site_name"></select>
      组件:<select class="App_name" name="App_name"></select>
      <a class="filter_btn uk-button" name="filter_btn">过滤</a>
      </div>
 </form>

JS:

$('#element_id').cxSelect({
      url: '/version/filter_app/',
      selects: ['Site_name', 'App_name'],
      jsonName: 'name',
      jsonSub: 'value',
      nodata: 'none'
    });

views.py

def filterAppFromSite(request):
    app_list = []
    site_names = S.objects.all()
    for site_name in site_names:
        app_names = site_name.app_name.all()
        app_dict = {}
        a = []
        for app_name in app_names:
            c = {}
            c['name'] = str(app_name.name)
            a.append(c)
        app_dict['name'] = str(site_name.name)
        app_dict['value'] = a
        app_list.append(app_dict)
    return render_to_json_response(app_list)

实现:

附一段通过MANYTOMANY检索语法:

从发布单倒追组件到项目,然后用ID IN功能检索多少条发布记录:

app_id_list = []
site = S.objects.get(name=self.kwargs['site_name'])
for app in site.app_name.all():
       app_id_list.append(app.id)

return DV.objects.filter(app_name_id__in=app_id_list)

DJANGO结合jQuery cxSelect 作二级菜单过滤的更多相关文章

  1. 转:jQuery弹出二级菜单

    <html> <head> <meta http-equiv="content-type" content="text/html; char ...

  2. django自定义rbac权限组件(二级菜单)

    一.目录结构 二.表结构设计 model.py from django.db import models # Create your models here. class Menu(models.Mo ...

  3. django中的构造字典(二级菜单,评论树,购物车)

    1.构造父子结构: 1.1需求样式 客户列表 customer_list /customer/list/ -----> 添加客户 customer_add /customer/add/ ---- ...

  4. Jquery垂直下拉二级菜单

    自己做了一个基于Jquery 的垂直下拉二级菜单功能,直接看图: Html的代码如下: <!DOCTYPE html> <html> <head> <meta ...

  5. 用jQuery做一个三级菜单,鼠标移动到二级菜单的选项上,然后再迅速离开后,当鼠标再移动到该一级菜单或其他二级菜单选项,三级菜单也会显示。

    用jQuery做一个三级菜单,鼠标移动到二级菜单的选项上,然后再迅速离开后,当鼠标再移动到该一级菜单或其他二级菜单选项,三级菜单也会显示. 原因:在为一个元素绑定hover事件之后,用户把光标移入元素 ...

  6. jquery垂直展开折叠手风琴二级菜单

    摘要:jquery实现垂直展开二级菜单 最近新开发一个简单项目,用到左侧两级的菜单.找找了手头的文件,竟然没有现成的代码,算了,去网上找找整理下吧. 注:jquery-1.8.3.min.js需要下载 ...

  7. 二级菜单jquery

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. jQuery cxSelect 多级联动下拉菜单

    随着电商热门,这种多层次的互动更充分地体现在下拉菜单,最明显的是多级联动地址下拉选择,因此,这里是一个简单的分享 jQuery cxSelect 多级联动下拉菜单 cxSelect 它是基于 jQue ...

  9. JavaScript(jquery)实现二级菜单联动

    为什么写这篇随笔? 二级菜单的联动一直是我心中一块石头,犹记得大一的时候只会用一点的Dreamweaver,当时做二级菜单难受啊,啥都不会,网上找了些资料,也看不懂别人的代码更别说用起来了 前些日子. ...

随机推荐

  1. PC电脑运行Android模拟器总是弹出“视频源”窗体的原因和解决方案

    原因: PC电脑运行Android模拟器时弹出“视频源”窗体,会让你"选择视频设备",如:HP TruevIsion HD,而这个视频设备就是你电脑中的内置摄像头,这个内置摄像头在 ...

  2. java匹配中文汉字的正则表达式

    正则表达式匹配中文先要了解中文的编码 代码如下 复制代码 [u4E00-u9FA5]汉字?[uFE30-uFFA0]全角字符 [u4E00-u9FA5]汉字?[uFE30-uFFA0]全角字符 匹配中 ...

  3. mysql 打包表在phpmyadmin提示正在使用中..

    一,利用phpmyadmin修改表功能,REPAIR TABLE `你的表名` 或直接在数据库管理界面,选中表如下图 二,如果利用修改功能失败了我们还可以尝试在替换本地mysql数据库时,我们先停止m ...

  4. ORACLE多表查询优化

    ORACLE有个高速缓冲的概念,这个高速缓冲就是存放执行过的SQL语句,那oracle在执行sql语句的时候要做很多工作,例如解析sql语句,估算索引利用率,绑定变量,读取数据块等等这些操作.假设高速 ...

  5. npm install --save 与 npm install --save-dev 的区别

    以npm安装msbuild为例: npm install msbuild: 会把msbuild包安装到node_modules目录中 不会修改package.json 之后运行npm install命 ...

  6. java如何调用webservice接口

    java调用WebService可以直接使用Apache提供的axis.jar自己编写代码,或者利用Eclipse自动生成WebService Client代码,利用其中的Proxy类进行调用.理论上 ...

  7. Web前端新人笔记之了解Jquery

    与javaScript相比,Jquery更简洁.浏览器的兼容性更强,语法更灵活,对xpath的支持更强大.一个$符就可以遍历文档中各级元素.例:在页面上有一个无序列表,我们需要将所有列表项中的文本内容 ...

  8. oracle pl/sql的操作大全

    --删除该用户及下面的所有关联 DROP USER fspdrs CASCADE; --创建一个用户 create user fspdrs identified " default tabl ...

  9. 使用fiddler4做代理调试手机页面

    由于一般手机不能改host,手机页面如果涉及到各个域名ip的混合使用,在手机上调试看效果非常麻烦. 使用fiddler4做代理,手机跟电脑连到同一个局域网,手机上网通过电脑做个代理上网,那么一切请求就 ...

  10. js鼠标及对象坐标控制属性详细解析

    对js鼠标及对象坐标控制属性进行了详细的分析介绍.  offsetTop获取对象相对于版面或由 offsetParent 属性指定的父坐标的计算顶端位置. offsetLeft获取对象相对于版面或由 ...