如何将数组从 json stringify 传递到 php 函数

Question

我对这件事感到困惑。

我有一个从 HTML 表构建的数组作为 json stringify 数据。

我想将该数组传递给php 函数，但不太成功。

我尝试了很多方法，但没有一个无法获取数据数组。

这是数据的数组：

// JavaScript Docume
$(document).on('click','#display_data',function(e){
    var convertTableToJson = function()
        {
            var rows = [];
            $('.table-bordered tr:has(td)').each(function(i, n){
                var $row = $(n);
                rows.push([
                    $row.find('td:eq(0)').text(),
                    $row.find('td:eq(1)').text(),
                    $row.find('td:eq(2)').text(),
                    $row.find('td:eq(3)').text(),
                    $row.find('td:eq(4)').text(),
                    $row.find('td:eq(5)').text(),
                    $row.find('td:eq(6)').text(),
                    $row.find('td:eq(7)').text(),
                ]);
            });
            return JSON.stringify(rows);
        };
    $(function(){        
       alert(convertTableToJson ());
    });
	
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="table table-bordered">
<thead>
<tr>
<th>Kode Material</th>
<th>Storage Location</th>
<th>Movement Type</th>
<th>Id Indentifier</th>
<th>Item</th>
<th>Date Input</th>
<th>Netto</th>
<th>Unit</th>
<th><input type="checkbox" id="mycheckbox1" name="mycheckbox1"></th>
</tr>
</thead>
<tbody>
<tr>
<td>101200</td>
<td>WCB</td>
<td>101</td>
<td>5006540050</td>
<td>1</td>
<td>10.08.2017</td>
<td>23.970</td>
<td>KG</td>
<td><input type="checkbox" class="mycheckbox" name="mycheckbox"></td>
</tr>
<tr>
<td>101200</td>
<td>WCB</td>
<td>101</td>
<td>5006539985</td>
<td>1</td>
<td>10.08.2017</td>
<td>42.970</td>
<td>KG</td>
<td><input type="checkbox" class="mycheckbox" name="mycheckbox"></td>
</tr>
</tbody>
</table>

<button id='display_data'>Click me </button>

我尝试编写这样的代码来将该数组传递给 PHP

$(document).on('click','#display_data',function(e){
    var convertTableToJson = function()
        {
            var rows = [];
            $('.table-bordered tr:has(td)').each(function(i, n){
                var $row = $(n);
                rows.push([
                    $row.find('td:eq(0)').text(),
                    $row.find('td:eq(1)').text(),
                    $row.find('td:eq(2)').text(),
                    $row.find('td:eq(3)').text(),
                    $row.find('td:eq(4)').text(),
                    $row.find('td:eq(5)').text(),
                    $row.find('td:eq(6)').text(),
                    $row.find('td:eq(7)').text(),
                ]);
            });
            $(".table-bordered").val(JSON.stringify(table_data));
        };
		
	var data = $(".table-bordered").val();
    $.ajax({
		data:data,	
		type:"POST",
		url:"../php/tagihan/save_data.php",
		dataType:"html",
			success: function(data){
				alert ("Data:" + data);
			}
    });
	
});

但是当我尝试echo 并尝试print_r 时，它可以显示数组。这是我制作的php 代码。

<?php
include('../../Connections/koneksi.php');

// reading json file
$array = json_decode( $_POST['table-bordered'] );
print_r ($array);


?>

Answer 1

.table-bordered 是一个<table>，你不能在表格元素上使用jQuery 的.val() 函数。

从 convertTableToJson 函数返回 JSON 字符串（就像在第一个代码示例中所做的那样）然后调用它来填充 data 变量更有意义：

var data = convertTableToJson();

您发布到服务器的数据需要是一个具有已知条目的对象，您可以在 PHP 中访问该对象。由于您已经在尝试访问$_POST['table-bordered']，我们将其命名为：

$.ajax({
    data: {
        'table-bordered': data
    },  
    type:"POST",
    url:"../php/tagihan/save_data.php",
    dataType:"html",
        success: function(data){
            alert ("Data:" + data);
        }
});

Answer 2

您希望table-bordered 密钥存在于$_POST 中，但它并不存在。您希望它存在，因为您在 HTML 中有一个 table-bordered，但这与您传递的内容没有联系。因此，第一步是确保此密钥将存在于您的$_POST：

$.ajax({
    data:{"table-bordered": data},  
    type:"POST",
    url:"../php/tagihan/save_data.php",
    dataType:"html",
        success: function(data){
            alert ("Data:" + data);
        }
});

这样我们以正确的方式传递data，但我们需要确保data 包含我们需要的值。您不能在 table 上为此目的使用 jQuery .val()，但我也没有看到将其放入 HTML 的意义。您可以将其存储在变量中：

$(document).on('click','#display_data',function(e){
    var rows = []; //Migrated here, as we will need it later
    var convertTableToJson = function()
        {
            $('.table-bordered tr:has(td)').each(function(i, n){
                var $row = $(n);
                rows.push([
                    $row.find('td:eq(0)').text(),
                    $row.find('td:eq(1)').text(),
                    $row.find('td:eq(2)').text(),
                    $row.find('td:eq(3)').text(),
                    $row.find('td:eq(4)').text(),
                    $row.find('td:eq(5)').text(),
                    $row.find('td:eq(6)').text(),
                    $row.find('td:eq(7)').text(),
                ]);
            });
            //This line will no longer be needed
            //$(".table-bordered").val(JSON.stringify(table_data));
        };

    //Incorrect line
    //var data = $(".table-bordered").val();
    //Correct line, it is unnecessary though, as you can directly pass rows
    //as data instead, but kept this to make sure the code is close to the
    //initial version
    var data = rows;
    $.ajax({
        data:{"table-bordered": data},  
        type:"POST",
        url:"../php/tagihan/save_data.php",
        dataType:"html",
            success: function(data){
                alert ("Data:" + data);
            }
    });

});