`

jquery datatables serverSide 为true时row.add() row().delete()不起作用

 
阅读更多

jquery datatables 的serverSide 为true时,从服务器端取数据,前端用js进行增加或删除行时,datatables的api中 row.add() row().delete()将不起作用,因为add或delete后会调用draw(),draw()会向服务器端重新发次请求,刚才添加或删除的dom瞬间被服务器端返回的数据覆盖了,问题深入讨论:

http://stackoverflow.com/questions/38486228/datatables-row-add-doesnt-work-with-serverside-option

 

解决办法:

 

先发一次ajax请求,从服务器端取回全部数据,然后再把这全部数据传递给datatables,此时datatables不使用serverSide(设置为false)。

 

附:datatables的API:

https://datatables.net/reference/api/

分享到:
评论

相关推荐

    开发工具 jquery.dataTables.min

    开发工具 jquery.dataTables.min开发工具 jquery.dataTables.min开发工具 jquery.dataTables.min开发工具 jquery.dataTables.min开发工具 jquery.dataTables.min开发工具 jquery.dataTables.min开发工具 jquery....

    jquery datatables 所需文件 官方下载的

    <script type="text/javascript" charset="utf8" src="js/DataTables-1.10.4/js/jquery.dataTables.js"> ``` 然后,对表格元素应用DataTables: ```javascript $(document).ready(function() { $('#example')....

    jquery.dataTables.min.js

    避免由于session失效,引发DataTable向后台发送ajax请求时弹窗报错而不是重定向到指定页面,详情https://blog.csdn.net/xssl_CSDN/article/details/83660015

    DONET的JQuery.Datatables集成插件(Mvc.JQuery.Datatables)

    【标题】:“DONET的JQuery.Datatables集成插件(Mvc.JQuery.Datatables)” 在.NET开发中,特别是使用ASP.NET MVC框架时,数据展示是一个常见的需求。`Mvc.JQuery.Datatables`是一个非常实用的插件,它允许开发者...

    开发工具 dataTables.bootstrap.min

    开发工具 dataTables.bootstrap.min开发工具 dataTables.bootstrap.min开发工具 dataTables.bootstrap.min开发工具 dataTables.bootstrap.min开发工具 dataTables.bootstrap.min开发工具 dataTables.bootstrap.min...

    jquery.dataTables包.rar

    这些文件通常包括`jquery.dataTables.min.js` 和 `dataTables.bootstrap.min.css` 等,它们提供了基本的功能和视觉样式。在HTML表格后,通过调用`.DataTable()` 方法来初始化插件,例如:`$('table').DataTable();`...

    jquery dataTables及相关css

    在提供的文件中,`jquery.dataTables.js`和`jquery.dataTables-1.7.5.js`是两个主要的JavaScript库,分别代表了DataTables的不同版本。这两个版本可能有不同的功能特性和API,开发者应根据项目需求选择合适的版本。...

    JQuery DataTables示例,包含分页、拖拽、导出

    serverSide: true, // 如果使用服务器端分页 processing: true, // 显示处理状态 ajax: 'server_processing', // 数据来源,如果是服务器端,需指向处理请求的URL columns: [ // 定义列 {data: 'column1'}, {...

    Jquery dataTable中文API中文文档

    - 引入`jquery.dataTables.js`文件。 - 引入`dt_bootstrap.js`文件,用于整合DataTable与Bootstrap的功能。 #### 三、HTML结构示例 ```html 编号 文章标题 所属类别 点击次数 审核 置顶 热点 添加...

    jQuery Datatables.zip

    "serverSide": true, "ajax": "/api/data", "columns": [ { "data": "name" }, { "data": "position" }, { "data": "office" }, { "data": "startDate" } ] }); }); ``` 这个例子展示了如何配置一个从...

    jquery dataTables组件

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

    dataTables.tableTools1.9.3.min.js

    dataTables.tableTools.1.9.3.min.js Jquery插件DataTables中的TableTools导出csv和PDF

    jQuery datatables插件

    1. **引入资源**:在HTML文件中引入jQuery库(如jquery-1.6.4.min.js)和DataTables脚本文件(通常为`jquery.dataTables.min.js`)以及对应的CSS文件。 2. **初始化表格**:通过JavaScript选择需要转换的表格元素,...

    jquery datatable serverside page 服务器端分页

    创建一个支持服务器端分页的DataTable,需要在初始化时设置`serverSide`参数为`true`。例如: ```javascript $(document).ready(function() { $('#example').DataTable( { "processing": true, "serverSide": ...

    jquery.dataTables.TreeTable:将jquery.treeTable集成到jquery.dataTables中

    jquery.dataTables.TreeTable 这是的插件,用于集成 。 不适用于最新的jquery-treetable插件 如果您仍然有兴趣,我确实创建了一个在线示例,希望这可以使您弄清楚。 要使用此插件,请检查前2点,并在第3点使用API...

    jquery的DataTable

    **jQuery的DataTable插件详解** jQuery的DataTable是一个强大的、高度可配置的JavaScript库,用于将HTML表格转换为功能丰富的数据网格。它提供了丰富的排序、过滤、分页、搜索和显示功能,大大增强了网页中表格的...

    jquery datatables实例

    这里,`processing`设置为`true`表示在数据加载期间显示加载指示器,`serverSide`设置为`true`表明数据将在服务器端处理。`ajax`属性指定了服务器脚本的URL,这个脚本将负责获取并返回数据。 服务器端,我们通常...

    Jquery可编辑表格插件DataTables-1.7.6.zip

    DataTables-1.7.6.zipDataTables-1.7.6.zipDataTables-1.7.6.zipDataTables-1.7.6.zipDataTables-1.7.6.zipDataTables-1.7.6.zipDataTables-1.7.6.zipDataTables-1.7.6.zipDataTables-1.7.6.zipDataTables-1.7.6.zip

    datatables render与日期转换(moment.js)

    `render` 是DataTables中的一个重要特性,它允许我们自定义列数据的显示方式。同时,`moment.js` 是一个强大的日期处理库,能轻松地处理各种日期和时间格式。现在我们将深入探讨如何在DataTables中结合使用`render` ...

Global site tag (gtag.js) - Google Analytics