Datatable.js + POSTing data PHP

Datatable.js + POSTing data PHP

本文关键字:data PHP POSTing js Datatable      更新时间:2023-09-26

我试图设置我的数据表POST到它的行到我的PHP脚本的内容,以便我可以将其存储在数据库中。

我有一个工作的HTML页面,当我点击"+添加映射"一个BS模式出现,我可以添加一行到数据表。

<script>
    $(document).ready(function() {
        var t = $('#parameters_config').DataTable();
        $('#add_new_mapping').on('click', function() {
            $('#add_field_mapping').modal('hide');
            var wb_field = $("#add_field_mapping #wb_field").val();
            var adobe_field = $("#add_field_mapping #adobe_field").val();
            t.row.add([
                adobe_field,
                wb_field,
            ]).draw();
            $('#add_new_field_mapping').trigger("reset");
        });
    });
</script>

这一切都很完美。现在,我想检索所有数据行并将它们POST到脚本中,以便处理提交的数据并进行存储。到目前为止,我已经根据提供的信息得出了这个结论:

 <script>
            $(document).ready(function() {
              $('#parameters').submit(function(event) {                   
                  var table = $('#parameters_config').DataTable();
                  var dataToSend = table
                    .rows()
                    .data();
                  console.log( 'Data', dataToSend);
                  alert( 'There are '+dataToSend.length+' row(s) of data in this table');
                  $.ajax({
                    type: 'POST',
                    url: '{$this->homeURL}',
                    data: dataToSend,
                    dataType: 'json',
                  });
              });
            });
        </script>

在控制台窗口中,我看到"dataToSend"返回了以下内容,但没有实际数据!

[Array[2], context: Array[1], selector: Object, ajax: Object]

我哪里错了?

例子出错的地方

你在帖子中链接的两个例子与你想要做的事情并不相关(从我能收集到的关于你的目标的信息)。

第一个示例是关于如何使用POST而不是默认的GET从服务器获取数据,并且与出于某种目的向服务器发送数据无关。

第二个例子是关于服务器端处理的,这是你在中处理的分页、排序、排序、过滤和所有其他datatable特性,你自己的服务器代码,然后你把结果发送给客户端(这是相当复杂的,除非你有大量的行,没有必要)。

因此,删除serverSide: true !

目标

你真正想做的(我认为)是把你的数据发送到一个php脚本,这样你就可以对它做一些事情。这不是由任何DataTables API调用处理的,但是实现起来相当简单。您真正需要的只是一个函数,该函数将进行AJAX调用,将数据发送到脚本。

<

解决方案/strong>

可以这样做的方法是通过使用t.data() API调用获取数据,然后使用ajax请求发送数据。它可能看起来像这样:

function sendData(){
    var dataToSend = t.data();
    $.ajax({
        type: 'POST',
        url: 'URL OF SCRIPT HERE',
        data: dataToSend
    });
}

然后你只需调用sendData()每当它是你想要发送数据。当然,您必须确保控制器正确处理数据,但这完全是另一回事。