对比分析Django的Q查询及AngularJS的Datatables分页插件


Posted in Javascript onFebruary 07, 2017

使用Q查询,首先要导入Q模块:

from django.db.models import Q

可以组合使用&,|操作符用于多个Q的对象,产生一个新的Q对象,Q对象也可以用~操作符放在前面表示否定,如下例所示:

if search:
   keywords_list = search.split(' ')
   query_list = [Q(status__icontains=get_success_fail_status(keyword)) if get_success_fail_keyword_status(keyword) else
       Q(username__icontains=keyword) |
       Q(groupid__icontains=keyword) |
       Q(status_active_vs__icontains=keyword) |
       Q(orders_created_time__icontains=keyword) |
       Q(status_bind__icontains=keyword) |
       Q(status_active_Bind__icontains=keyword) |
       Q(env__icontains=keyword) for keyword in keywords_list]
   q = Q()
   for query in query_list:
    q.add(query, Q.AND) #把query添加到之前定义的最外层的Q对象中,查询条件是 '和'

其中Q查询里面的 __icontains 表示包含的关系,用于模糊查询,如:

Q(username__icontains=keyword) | Q(groupid__icontains=keyword) 表示查询 username或者 groupid

再谈谈AngularJS的Datatables分页插件:

Datatables的主要功能是分页、即时搜索和排序,虽然django自带的模板引擎也有分页功能(Paginator),但无论从功能上还是美观上,Datatables都更好。

Datatables的效果如下图所示:

对比分析Django的Q查询及AngularJS的Datatables分页插件

对比分析Django的Q查询及AngularJS的Datatables分页插件

下面讲一下Datatables的DTOptionsBuilder方法:

DTOptionsBuilder.newOptions是AngularJS的datatables的一个重要的方法,.newOptions用于实现前后端分页,

DTOptionsBuilder.newOptions()
 .withOption('ajax', {
  url: "/api/other/get_http_https_apply/",
  type: 'GET'
 })
 .withDataProp('data')
 .withOption('serverSide', true)
 .withPaginationType('full_numbers')
 .withOption('createdRow', createdRow)
 .withOption('order', [
  [0, 'desc']
 ]);

'serverSide', true 表示开启服务器模式,

ajax表示数据的来源(包括处理分页,排序,过滤),

full_numbers表示所有的数据,

http_https.dtColumns = [
  DTColumnBuilder.newColumn('id').withTitle('ID'),
  DTColumnBuilder.newColumn('username').withTitle('申请人'),
  DTColumnBuilder.newColumn('env').withTitle('环境'),
  DTColumnBuilder.newColumn('groupid').withTitle('group_id'),
  DTColumnBuilder.newColumn('status_active_vs').withTitle('激活vs').renderWith(apply_status),
  DTColumnBuilder.newColumn('status_bind').withTitle('绑定').renderWith(apply_status),
  DTColumnBuilder.newColumn('status_active_Bind').withTitle('激活绑定').renderWith(apply_status),
  DTColumnBuilder.newColumn('status').withTitle('最终结果').renderWith(apply_status),
  DTColumnBuilder.newColumn('orders_created_time').withTitle('时间')
 ];
 //判断是否是admin用户,如果是admin,则在http_https.dtColumns这个数组中增加(push)一个元素
 if (http_https.js_admin) {
  http_https.dtColumns.push(DTColumnBuilder.newColumn(null).renderWith(actionsHtml).withTitle('Actions'))
 }

DTColumnBuilder.newColumn表示新增表格的列

.renderWith对数据进行渲染  这里apply_status是我自己写的一个函数,用于转换json中True和False对应的html中的“成功、失败”

部分详情代码请见我的github:https://github.com/a342058040/Django_AngularJS_Datatables.git

以上所述是小编给大家介绍的对比分析Django的Q查询及AngularJS的Datatables分页插件,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
贴一个在Mozilla中常用的Javascript代码
Jan 09 Javascript
IE bug table元素的innerHTML
Jan 11 Javascript
如何让页面加载完成后执行js
Jun 26 Javascript
一个字符串反转函数可实现字符串倒序
Sep 15 Javascript
javascript基本包装类型介绍
Apr 10 Javascript
AngularJS中的JSONP实例解析
Dec 01 Javascript
Vue.js 2.0学习教程之从基础到组件详解
Apr 24 Javascript
js上传图片预览的实现方法
May 09 Javascript
安装Node.js并启动本地服务的操作教程
May 12 Javascript
JavaScript深入V8引擎以及编写优化代码的5个技巧
Jun 24 Javascript
浅谈微信小程序列表埋点曝光指南
Oct 15 Javascript
js定时器出现第一次延迟的原因及解决方法
Jan 04 Javascript
jquery 判断是否支持Placeholder属性的方法
Feb 07 #Javascript
深入理解JavaScript中的for循环
Feb 07 #Javascript
vue实现ToDoList简单实例
Feb 07 #Javascript
js Canvas绘制圆形时钟教程
Feb 06 #Javascript
JS中静态页面实现微信分享功能
Feb 06 #Javascript
JS日程管理插件FullCalendar中文说明文档
Feb 06 #Javascript
Javascript之深入浅出prototype
Feb 06 #Javascript
You might like
PHP新手上路(二)
2006/10/09 PHP
一周让你学会PHP 不错的学习资料
2009/02/06 PHP
深入PHP操作MongoDB的技术总结
2013/06/02 PHP
PHP错误和异长常处理总结
2014/03/06 PHP
推荐一款PHP+jQuery制作的列表分页的功能模块
2014/10/14 PHP
PHP进程同步代码实例
2015/02/12 PHP
smarty高级特性之对象的使用方法
2015/12/25 PHP
Yii中CGridView禁止列排序的设置方法
2016/07/12 PHP
javascript中数组的sort()方法的使用介绍
2013/12/18 Javascript
javascript实现页面内关键词高亮显示代码
2014/04/03 Javascript
JQuery中两个ul标签的li互相移动实现方法
2015/05/18 Javascript
Vue实现购物车功能
2017/04/27 Javascript
ES6学习教程之Map的常用方法总结
2017/08/03 Javascript
浅谈React中的元素、组件、实例和节点
2018/02/27 Javascript
小程序Request的另类用法详解
2019/08/09 Javascript
使用layui的router来进行传参的实现方法
2019/09/06 Javascript
基于JavaScript获取base64图片大小
2019/10/18 Javascript
nuxt引入组件和公共样式的操作
2020/11/05 Javascript
HTML元素拖拽功能实现的完整实例
2020/12/04 Javascript
[01:00:25]NB vs Secret 2018国际邀请赛小组赛BO1 B组加赛 8.19
2018/08/21 DOTA
pip matplotlib报错equired packages can not be built解决
2018/01/06 Python
Python基于property实现类的特性操作示例
2018/06/15 Python
python 判断三个数字中的最大值实例代码
2019/07/24 Python
django中media媒体路径设置的步骤
2019/11/15 Python
python3注册全局热键的实现
2020/03/22 Python
python 使用paramiko模块进行封装,远程操作linux主机的示例代码
2020/12/03 Python
关于HTML5 Placeholder新标签低版本浏览器下不兼容的问题分析及解决办法
2016/01/27 HTML / CSS
PREMIUM-MALL法国:行李、箱包及配件在线
2019/05/30 全球购物
三星俄罗斯授权在线商店:Samsung俄罗斯
2019/09/28 全球购物
Edwaybuy西班牙:小米在线商店
2019/12/04 全球购物
正宗的澳大利亚Ugg靴子零售商:UGG Express
2020/04/19 全球购物
我心目中的好老师活动方案
2014/08/19 职场文书
大学生实习证明范本
2014/09/19 职场文书
2014年法制宣传日活动方案
2014/11/02 职场文书
考研英语辞职信
2015/05/13 职场文书
离职员工给领导和同事的感谢信
2015/11/03 职场文书