metronic 表格插件 datatables
官方网站:https://datatables.net/
css引入:datatables.min.css && datatables.bootstrap.css && bootstrap-datepicker3.min.css
j s 引入:datatable.js && datatables.min.js && datatables.bootstrap.js
html代码:
<table class="table table-striped table-bordered table-hover table-checkable order-column" id="datatable_orders"></table>
初始化:
var initTable1 = function () {
var table = $('#datatable_orders');//table ID
var oTable = table.dataTable({
"language": {
"aria": {
"sortAscending": ": activate to sort column ascending",
"sortDescending": ": activate to sort column descending"
},
"emptyTable": "No data available in table",
"info": "Showing _START_ to _END_ of _TOTAL_ entries",
"infoEmpty": "No entries found",
"infoFiltered": "(filtered1 from _MAX_ total entries)",
"lengthMenu": "_MENU_ entries",
"search": "Search:",
"zeroRecords": "No matching records found"
},
buttons: [
// { extend: 'print', className: 'btn dark btn-outline' },
// { extend: 'copy', className: 'btn red btn-outline' },
// { extend: 'pdf', className: 'btn green btn-outline' },
// { extend: 'excel', className: 'btn yellow btn-outline ' },
// { extend: 'csv', className: 'btn purple btn-outline ' },
// { extend: 'colvis', className: 'btn dark btn-outline', text: 'Columns'}
],
// setup responsive extension: http://datatables.net/extensions/responsive/
responsive: true,
paging: false, //分页
searching: false, //搜索
ordering: true, //排序
"order": [
[, 'asc']
],
"lengthMenu": [
[, , , , -],
[, , , , "All"] // change per page values here
],
"pageLength": ,
"dom": "<'row' <'col-md-12'B>><'row'<'col-md-6 col-sm-12'l><'col-md-6 col-sm-12'f>r><'table-scrollable't><'row'<'col-md-5 col-sm-12'i><'col-md-7 col-sm-12'p>>", // horizobtal scrollable datatable
});
}
initTable1();
metronic 表格插件 datatables的更多相关文章
- 基于JQuery可拖动列表格插件DataTables的踩坑记
前言 最近项目中在使用能够拖动列调整列位置顺序的表格插件---DataTables,这也是目前我找到的唯一一种存在有这种功能的插件. 在查找使用方法的过程中发现可用案例并不多,且大多言语不详.本文将全 ...
- JQuery表格插件DataTables 当前页合计功能
公司项目表格插件使用的是DataTables,最近添加表合计功能,发现百度统一都是如图类型的代码,不知道是配置问题还是怎么了,在我的页面下根本不能用 var addd=0; $(document).r ...
- 一款比较强大的jquery表格插件Datatables
Datatables是一款jquery表格插件.它是一个高度灵活的工具,可以将任何HTML表格添加高级的交互功能. 链接:http://www.datatables.club/ 本人无聊时发现的一款用 ...
- jquery表格插件Datatables使用、快速上手
Datatables使用 一.简介 官网:https://datatables.net/ 中文官网:http://datatables.club/ Datatables是一款jquery表格插件.它是 ...
- jquery 强大表格插件 DataTables
官网:https://datatables.net/ 配置:https://datatables.net/reference/option/ API :https://datatables.net/r ...
- 表格插件datatables
具体用法查看官网 https://datatables.net/ {% load staticfiles %} <!DOCTYPE html> <html lang="en ...
- 前端表格插件datatables
下载datatables datatables官网:https://www.datatables.net/ datatables下载地址:https://www.datatables.net/down ...
- datatables 前端表格插件 增删改查功能
官方网站:http://datatables.club/example/<!-- DataTables CSS -->css引入的<link rel="stylesheet ...
- Datatables快速入门开发--一款好用的JQuery表格插件
博主是一个java后端程序员小白,前端技术会用但不精通,做后台的一些功能经常要涉及表格的展示,分页,搜索,排序等等一系列功能,在经历了一段时间的原始手段,开始接触并使用Datatables,一个jqu ...
随机推荐
- 安装Windows和Ubuntu双系统--Ubuntu安装过程识别不了硬盘
Linux识别不了固态硬盘 安装过程: 自己本身的是Windows 10,一块125g 固态 ,一块1T的机械硬盘. 通过rufus 制作ubuntu的启动盘 在BIOS中关闭电脑的安全启动选项,并且 ...
- unittest加载测试用例名称必须以test开头,是否可以定制化
前几天,在一个群里,一个人问了,这样一个问题.说他面试遇到一个面试官,问他,为啥unittest的测试用例要用test 开头,能不能定制化.他不知道为啥. 看到这个题目,我回答当然可以了,可以用l ...
- PHP判断数组下标有没有存在的方法
PHP判断数组下标有没有存在的方法<pre>if(!empty($token['errcode'])){ print_r($token['errmsg']); exit();}</p ...
- 201871010114-李岩松《面向对象程序设计(java)》第一周学习总结
项目 内容 这个作业属于哪个课程 https://www.cnblogs.com/nwnu-daizh/ 这个作业的要求在哪里 https://www.cnblogs.com/nwnu-daizh/p ...
- VS2019打包WPF安装程序最新教程
VS2019打包WPF安装程序最新教程,使用Visual Studio 2019开发的WPF程序如果想要打包为安装程序,除了在VS2019找到WPF项目类库直接右键发布之外,更常用的还是将其打包为ex ...
- Conda/Miniconda/Anaconda 常用命令整理及介绍
作者:HELO 出处:http://www.cnblogs.com/HELO-K 欢迎转载, 转载时请保留此声明, 谢谢! 在这里整理一份全一点的 Conda 常用命令, 方便大家日常使用时参考, 一 ...
- PHP laravel+thrift+swoole打造微服务框架
Laravel作为最受欢迎的php web框架一直广受广大互联网公司的喜爱. 笔者也参与过一些由laravel开发的项目.虽然laravel的性能广受诟病但是业界也有一些比较好的解决方案,比如堆机器, ...
- VMware安装Ubuntu 16.04.4 LTS
1.下载Ubuntu镜像 https://www.ubuntu.com/download/desktop 2.创建新的虚拟机 3. 4.这里默认即可,可以不选 5. 6. 7.这里位置可以随时改 8. ...
- java编程思想第四版第十一章习题
第一题 package net.mindview.holding.test1; import java.util.ArrayList; import java.util.List; /** * 沙鼠 ...
- python:类1——类和对象基础
一.OO = Object Oriented 面向对象 OOP面向对象编程.OOA面向对象分析.OOD面向对象设计 二.属性+方法——>类(数据和函数) class Turtle(): #类名约 ...