`

jQuery DataTables插件 列于数据的对应关系

阅读更多
初始化表格时,要使用aoColumnDefs或者aoColumns属性给每一列设置属性。
无论列是否显示,表格中新加的数据,如果按照下列设置,则数据源每一列都不能少。例如:
aoColumnDefs : [
  {"aTargets" : [0], "mData" : "name"},
  {“aTargets” : [1], “mData” : “age”},
  {“aTargets” : [2], “mData” : “salary”}
]


那么使用table.fnAddData(arrayData)时,arrayData的数据必须是:
[
  {“name” : “Jim”, “age”: 20, “salary”: 1000000},
]


每个列对应的属性都不能少。
如果某一列对应的属性可能会缺失,则可以如下设置避免出错:
aoColumnDefs : [
  {"aTargets" : [0], "mData" : "name"},
  {“aTargets” : [1], “mData” : “age”},
  {“aTargets” : [2], “mData” : function(source, type, val){
      if(source.salary){
        return source.salary;
      }else{
        return null;
      }
  }}
]


如果既不用aoColumnDefs也不用aoColumns给表格列设置属性,那么就得使用如下方式直接添加数据,而不能使用对象的方式:
dataTable.fnAddData(['Jim', 21, 1000000])

数据会按照顺序,原封不动的插入到单元格中。如果想在单元格中放入checkbox,可以直接用:
dataTable.fnAddData(['<input type="checkbox">', 21, 1000000])


如果某一列无“数据源”,则可以在初始化表格时如下设定:
"aoColumns": [
  null,
  null,
  { "mData": null }
]

也可以在aoColumnDefs中设置 mData : null

则添加数据时可以使用如下格式,缺少一列数据。
[
  {“name” : “Jim”, “age”: 20},
]
分享到:
评论

相关推荐

    jQuery datatables插件

    总结来说,jQuery DataTables插件为HTML表格提供了强大的功能和灵活性,无论是基础的排序和过滤,还是更复杂的自定义需求,都能满足。配合合理的配置和API使用,可以极大地提升网页数据管理的用户体验。

    jQuery+datatables插件实现ajax加载数据与增删改查功能示例

    描述中进一步明确了本文档的知识点范围,主要介绍如何通过jQuery和datatables插件实现数据的增删改查功能,并且特别强调了与页面表格相关的操作技巧。这些技巧可能包括表格初始化设置、事件监听、数据请求的配置和...

    jquery dataTables及相关css

    在Web开发中,数据展示和管理是一项常见的任务,而jQuery DataTables插件为此提供了一种高效且功能丰富的解决方案。本文将深入探讨jQuery DataTables及其相关的CSS,以及如何结合使用它们来提升网页表格的交互性和...

    jquery dataTables组件

    1. **样式兼容**:DataTables提供了Bootstrap主题,只需在CSS引用中加入对应的Bootstrap CSS,如`dataTables.bootstrap.min.css`,确保表格样式与Bootstrap保持一致。 2. **按钮扩展**:DataTables有内置的按钮插件...

    jQuery DataTables插件自定义Ajax分页实例解析

    《jQuery DataTables插件自定义Ajax分页实例解析》 在前端开发中,尤其是在处理大量数据展示时,分页功能显得尤为重要。jQuery DataTables是一款强大的表格插件,它提供了丰富的功能,包括排序、搜索和分页等。然而...

    jQuery设置表格列字段筛选改变代码

    // 如果使用了DataTables插件,需要引入对应的库 $(document).ready(function() { $('#myTable').DataTable(); }); ``` 以上代码中,我们使用了DataTables插件,它提供了强大的表格功能,包括排序、过滤和分页。在...

    Jquery dataTable后台获取数据示例

    1. **引入依赖**: 首先确保项目中已经包含了jQuery、DataTables以及对应的CSS和JS文件,如果使用Struts2,还需要引入Struts2-jQuery插件。 2. **HTML布局**: 创建一个基本的HTML表格,并为其附加DataTables初始化...

    Jquery dataTable显示指定列

    在本文中,我们将深入探讨如何使用Jquery dataTable插件来显示指定列,特别是在处理隐藏列的情况下。`Jquery dataTable` 是一个强大且功能丰富的JavaScript库,用于处理HTML表格,提供了排序、过滤、分页等特性,极...

    jquery表格插件带分页动态数据表格代码

    在jQuery表格插件中,动态加载通常与分页结合使用,当用户滚动到底部时,自动加载下一页数据。这需要在插件中设置相应的监听事件,并配合Ajax请求实现。 四、Ajax Ajax(异步JavaScript和XML)是实现网页无刷新...

    Jquery Datatables的使用详解

    这个插件能够与Bootstrap 3/4、jQuery UI等前端框架完美融合,提供美观且易用的表格展示。 ### 安装 在开始使用DataTables之前,你需要从官方网站下载相应的文件。下载页面允许你自定义下载内容,如样式、扩展组件...

    ssm整合datatables实例Demo

    SSM整合Datatables实例Demo是将SpringMVC、Spring和MyBatis这三大流行Java Web框架集成,并结合Datatables插件实现数据展示和交互的示例项目。这个Demo旨在帮助开发者理解如何在实际项目中有效地利用这些技术进行...

    jquery图表插件可编辑表格生成走势图

    1. **编辑表格**: jQuery插件如DataTables或Handsontable提供了一种简便的方法来实现表格的编辑功能。这些插件允许用户直接在表格单元格中输入、修改数据,并且支持排序、搜索、过滤等功能,提高了数据管理的效率。 ...

    网络收集100个常用的jquery特效和插件打包下载

    这些jQuery特效和插件涵盖了网页设计的各个方面,无论是基础功能增强还是复杂交互实现,都有对应的解决方案。学习和掌握这些特效和插件,将大大提高前端开发效率,创造出更富吸引力的网页应用。通过深入理解和实践...

    datatables

    **datatables 插件** ...总之,`datatables` 是一款强大且功能齐全的表格插件,能够帮助开发者创建功能丰富、用户体验优秀的数据展示界面。通过深入理解和充分利用其特性,可以大大提高Web应用的数据处理和展示效率。

    利用JQuery实现datatables插件的增加和删除行功能

    在本文中,我们将深入探讨如何使用JQuery与DataTables插件来实现表格中行的增加和删除功能。DataTables是一款强大的jQuery插件,它能够使HTML表格具备丰富的数据处理和展示能力,包括排序、搜索、分页等。下面我们将...

    JQuery插件(整体框架)

    JQuery DataTables插件提供了强大的数据表格功能,包括排序、搜索、分页和自定义样式,同时还支持服务器端处理和数据源的多样化。 4. **数据汇总(Summation)**:在大量数据中进行汇总计算是数据分析和报表展示的...

    DataTablesAspNetMvcDemo:asp.net mvc 5 项目中 Jquery Datatables 集成的演示

    在本文中,我们将深入探讨如何在ASP.NET MVC 5项目中集成Jquery DataTables库进行数据展示和操作。`DataTablesAspNetMvcDemo`是一个示例项目,它清晰地展示了这一集成过程,帮助开发者理解如何在实际应用中实现高效...

    Laravel开发-datatables

    Datatables是一款强大的jQuery插件,它能够帮助开发者实现数据的动态展示、排序、过滤和分页,极大地提高了用户体验。在Laravel中集成datatables,可以将后端的复杂逻辑与前端的交互体验完美结合。 首先,我们要...

    jquery 分页插件

    “两个插件”可能指的是插件的多样性,jQuery 社区中有多个广受欢迎的分页插件,如 jQuery Pagination、jQuery UI Paginate 或 DataTables 的分页功能等。这些插件提供了丰富的配置选项和自定义样式,使得开发者可以...

    DataTables-1.8.0

    DataTables 是一个强大的 jQuery 插件,用于将 HTML 表格转化为功能丰富的数据展示工具。在版本 1.8.0 中,它提供了许多高级功能,使得数据的管理和交互更加便捷,增强了用户体验。这个插件尤其适用于那些需要处理...

Global site tag (gtag.js) - Google Analytics