dataTable API阅读记录------Data
原文:https://www.datatables.net/manual/data 个人水平有限,仅供参考,
关于处理数据,dataTable有三个核心概念:处理模式、数据类型、数据来源
一、处理模式(排序、查询等)
1.客户端处理或者服务器处理,官网提供的参考建议是数据少于10000条搁客户端,多于10万条搁服务器端,介于两者之间,自己根据项目特性选择;两种处理模式是无法共存的,也不能动态切换。
2.客户端处理模式是默认模式,该模式不需要额外的代码,所有的数据操作都是DataTable自己完成的
3.服务器端处理模式适用于处理百万级别的数据,所有对数据的操作将在服务器端进行,否则前台javascript处理需要很大的开销,如此会降低你的应用体验。
二、数据类型
表格主体部分的数据必须是数组(当使用DOM数据时自动创建),支持三种类型的javascript数据:Arrays-[]、Objects-{}、Instances-new MyClass(),默认为Arrarys,后两着当处理复杂数据时很有用。
Arrarys
Arrarys很适合用于datatable,数组中的每个对象映射表中的每一行,同时每个对象的每一个参数依次对应表的每一列,所以对于6列的表,你的每一个对象必须要有6个数据。
example:
Objects
对象的好处是把每一行的数据作为一个对象,这样做的好处是你不需要像Arrarys一样记忆每个对象中元素对应的列,在写代码时也更为方便。需要补充的是,你做了多少个映射,表格便会显示多少列。
example:
Instance
它和前两者的区别是传递的参数可以是方法,dataTable会识别这个方法,并将方法执行完的返回值作为数据在表中展示。
三、数据来源
定义完了处理模式和数据类型,我们现在可以思考数据来源了,DataTable有三种基本的数据来源:
-DOM
-JavaScript
-Ajax sourced data
DOM
当DataTable运行时,它会自动检测所选表是否有数据,会将表内以后的数据作为自己的数据来源,这是最简单的使用方法——使用常规HTML表格(说白了是为表格提供DataTable样式),需要补充的是,这里的数据类型是Arrarys。
Javascript
你也可以用表单中的数据来构建你的DataTable,数据来源于任何Javascript能获得的区域。这种方式对于使用扩展的DataTables API非常有用,尤其是你在使用row().add()和row().remove()时,同时可以动态增删数据。
Ajax
Ajax来源数据很大程度上类似Javascript,区别在于它会使用Ajax call获得数据。该方法的好处在于可以从逻辑上分开数据,(提供按页面单独请求,而不是一次请求完全部数据),你可以把属性值拼凑成一个String,加上URL提交给请求,通过ajax选项来控制。
该来源支持arrarys和objects,但不支持instances
Server-side processing 是一种特殊的Ajax数据来源,每一页的数据只有在被使用者需要时才会被Ajax请求检索出来,这让服务器上的数据库引擎得以用于批量的数据处理。
- 大小: 37.3 KB
- 大小: 72.4 KB
- 大小: 61.9 KB
分享到:
相关推荐
jquery datatable api chm 中文
jquery datatable api jquery插件 table
JQuery DataTable中文文档API.chm中文API,版本:JQuery DataTable中文文档API.chm,解压即食,
Jquery dataTable API 中文文档 word版 好用实在
import DataTable from 'react-data-table' ; var options = { i18n : { from : 'Risultati da' , to : 'a' , of : 'di' , entries : 'totali.' } } ; var columns = [ { name : 'name' , label : '
datatable的一个简单实用,可以参照http://blog.csdn.net/u011563903 一篇博客的介绍
Ajax-datatable-using-ajax-php.zip,使用ajax php的数据表,ajax代表异步javascript和xml。它是多种web技术的集合,包括html、css、json、xml和javascript。它用于创建动态网页,其中网页的小部分在不重新加载网页的...
gridview—datatable -dataset -dataview 2011-01-17
angular2-datatable, 带有排序和分页的Angular2简单表组件 table 组件,具有对Angular2进行排序和分页的功能 演示在plunker中检查实时演示安装npm i -S angular2-datatable用法示例AppModule.ts
VUE数据表 ... 它受启发,但是它是使用Vue从零开始编写的。 目录 作者 内置 特征 多列排序 分页 ...import DataTable from "@andresouzaabreu/vue-data-table" ; Vue . component ( "data-table" , Data
ngx-datatable ngx-datatable是用于显示大型和复杂数据的Angular组件。 它具有您希望从任何其他表获得的所有功能,但封装轻巧,没有...datatable,请通过安装它: npm i @swimlane/ngx-datatable --save学分ngx-data
React数据表组件扩展将表格数据导出为CSV或Excel文件,过滤并打印数据。入门使用 NPM 安装: $ npm install react-data-table-...import DataTable from 'react-data-table-component' ;import DataTableExtensions
This DataTables plugin (v1.4.x) for jQuery was developed out of the desire to allow highly configurable access to HTML tables with advanced access features
jQuery datatable1.10.5 api 有demo可以查看
资源分类:Python库 所属语言:Python 资源全名:django_ajax_datatable-4.0.2-py2.py3-none-any.whl 资源来源:官方 安装方法:https://lanzao.blog.csdn.net/article/details/101784059
引入第三方库 Newtonsoft.Json,调用里面方法实现转换功能。这个可以从NuGet程序包搜索此名称下载!
vue2-datatable-component 永远不会烂的Vue.js 2.x最佳数据表npm i -S vue2-datatable-component |
基于bootstrap + php +ajax datatable 插件的使用-附件资源