时间戳

首页 > 解决方案 > 将 Tabulator 数据更改回服务器 - RESTful

rest - 将 Tabulator 数据更改回服务器 - RESTful

问题描述

我只是喜欢制表机！我成功地使用它来格式化从我们的 SaaS 的 REST 服务检索到的传入数据的表格。响应很容易在 Tabulator 中实现并显示在自定义表单（JSP 页面）上。s 我的愿望和许多人一样，是向 Jthe tabulator JSON 格式数据更改和删除的 REST 服务发送 POST、PUT、DELETE。我知道 Tabulator 不适用于 CRUD 流程，但我可以从如何实现此示例中遵循的“最佳实践”或编码模式是什么。我看到了添加仅返回更改的 Tabulator 方法的请求，但它不是当前实现的东西（或者可能永远不会实现）。

我将使用“保存”按钮来启动对 REST 服务的方法/函数/调用以处理 JSON。我对如何处理删除的内容、更改的内容以及添加到虚拟 DOM 的内容有点困惑，以便我可以为 REST 调用提取该信息。

提前致谢。示例将不胜感激。

罗恩狗

标签： restpostcrudputtabulator

解决方案

您如何处理这将取决于您如何在服务器中设置代码，有几个选项。

发回所有数据

您可以使用getData函数检索所有表数据，然后一次性将其发回，然后对表中行中的所有数据进行更新操作，并检查是否缺少任何数据。

var data = table.getData();

跟踪变化

您可以使用cellEdited回调来跟踪单元格何时被编辑，然后存储行数据以供以后上传到服务器

var table = new Tabulator("#example-table", {
    cellEdited:function(cell){
        //cell - cell component
     
        var row = cell.getRow();

        //store row component for later use when sending data back to server 
    },
});

然后，您可以使用rowAdded Callback对新行采取类似的方法

var table = new Tabulator("#example-table", {
    rowAdded:function(row){
        //row - row component

        //store row component for later use when sending data back to server 
    },
});

使用rowDeleted回调删除的行也是如此

var table = new Tabulator("#example-table", {
    rowDeleted:function(row){
        //row - row component

//store row component for later use when sending data back to server 
    },
});

推荐阅读