无法通过 AJAX 将多维数组从 JavaScript 发送到 PHP

问题描述 投票：0回答：3

我看到很多关于同一件事的问题。但我尝试了很多事情，我真的不确定我所做的是否还有效。

所以，我有这个多维数组，它是通过循环遍历 html 表创建的。我想将其发送到 PHP，这样我就可以循环它，并创建我需要将其存储在数据库中的对象。

但是当我尝试通过 foreach 循环它时，我从 PHP 得到的只是

“警告：为 foreach() 提供的参数无效”

function ReturnFamilyMembers() 
{
   var Family = [];
   var Table= document.getElementById('FamilyTable');
   var RowQuantity= Table.rows.length; 
   
   for (var i = 0; i < RowQuantity; i++)
   {
     var Columns= Table.rows.item(i).cells;
     var ColumnQuantity= Columns.length;
     Family[i] = [];
   
        for(var j = 0; j < ColumnQuantity; j++)
        {
          Family[i][j] = Columns.item(j).innerHTML;
        }
    }

    var headers =
    {
        'Content-type': 'application/x-www-form-urlencoded',
        'X-Requested-With': 'XMLHttpRequest'
    };
    
    var FamilyArray = encodeURIComponent( JSON.stringify( Family) );
    /*console.info( payload );*/

    var xhttp = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP");

    /* Add a callback function to process any response from target url ( Worker.php )*/
    xhttp.onreadystatechange = function()
                            {
                                if( xhttp.readyState == 4 && xhttp.status == 200 )
                                {
                                    cbReturnFamilyMembers.call( this, xhttp.response );
                                }
                            };
                                
    xhttp.open( 'POST', 'Worker.php', true ); 
    for( header in headers ) xhttp.setRequestHeader( header, headers[ header ] );
    xhttp.send( 'Family=' + FamilyArray );

}

function cbReturnFamilyMembers($resp,$response)
{
    alert($resp + $response);
}
}

还有 PHP 方面...

$Family =  json_decode( $_POST['Family'],true);

foreach($Family as $Array)  ---> This line launches the error.
{
   foreach($Array as $Value) 
   {
    ///object creation
   }
}

提前谢谢您。我想我真的被困在这里了，因为我是 PHP、JS 和 AJAX 的新手，一切似乎都神奇地发生。 （真的不能说我做事的方式是否正确。） 我希望我说得足够清楚，或者如果我可以澄清任何事情请告诉我。

------------------------------------------------------------------------- -------------------------------------------

编辑：我很抱歉这么晚才回复，感谢您的回答。我将更新代码，以便您可以看到我到目前为止所做的事情。 （基本上我改变了 Ajax 部分，像你们说的那样成为 POST 操作）。 我想我没有很好地解释整个事情，这个数组必须通过提交表单来发送，这个函数在“onSubmit”上调用（抱歉缺乏解释）。我意识到我在 php 的 $_POST 数组中没有一个名为“Family”的成员，因为我收到了“未找到索引”的错误，所以，我在表单中隐藏了一个输入并以这种方式调用它名称属性。 尽管如此，我仍然在 php 端收到一个类似非数组的值（实际上，当我回显它时，它会打印一个一（1））。 我开始考虑传递数组的其他方式，但这就是我首先使用 JS 和 ajax 的原因。 我对此表示怀疑 “xhttp.send（'家庭='+数组）;”部分...它真的将数组发布到 $_POST 数组的索引 ['Family'] 上吗？我想知道。 也许作为值传递的数组被表单的输入覆盖（实际上提交时没有值）

再次编辑****************

更改了代码，并且完美运行。（将 Cast 添加到数组对象）

$Family =  (Array)json_decode( $_POST['Family']);
javascript php arrays ajax
3个回答
2
投票

昨晚当我发布最初的评论时，我没有注意到原始函数的一些小错误，尽管其他人已经注意到它们并在上面传递了评论 - 该函数据说是通过 

POST
发送的，但没有参数在 
send()
方法中发送，仅附加到 url，就像对 
GET
请求所做的那样。另外，虽然我相信这并不重要，但您没有在请求中设置任何标头，也没有回调函数。

下面更改后的代码确实按预期通过

POST

发送表中的内容 
<script type='text/javascript'>
    /* callback function to handle response data */
    function cbReturnFamilyMembers( response ){
        alert( response )   
    }

    function ReturnFamilyMembers() {
       var Family = [];
       var Table= document.getElementById('FamilyTable');
       var RowQuantity= Table.rows.length; 

       for ( var i = 0; i < RowQuantity; i++ ){
            var Columns= Table.rows.item(i).cells;
            var ColumnQuantity= Columns.length;
            Family[i] = [];
            for( var j = 0; j < ColumnQuantity; j++ ) Family[i][j] = Columns.item(j).innerHTML;
        }

        /* XHR headers to be set */
        var headers={
            'Content-type': 'application/x-www-form-urlencoded',
            'X-Requested-With': 'XMLHttpRequest'
        };
        var payload=encodeURIComponent( JSON.stringify( Family ) );
        /*console.info( payload );*/

        var xhttp=window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP");

        /* Add a callback function to process any response from target url ( Worker.php )*/
        xhttp.onreadystatechange=function(){
            if( xhttp.readyState==4 && xhttp.status==200 ){
                cbReturnFamilyMembers.call( this, xhttp.response );
            }
        };

        xhttp.open( 'POST', 'Worker.php', true ); 
        for( header in headers ) xhttp.setRequestHeader( header, headers[ header ] );
        xhttp.send( 'Family='+payload );
    }
</script>
2
投票

我不是本地 JavaScript 专家（在 AJAX 等方面我更喜欢 jQuery 之类的东西），但是从我在代码中读到的内容来看，您没有在 PHP 端收到预期的 POST 数据。看着你的 ajax 调用，我发现了一些奇怪的东西：

xhttp.open("POST", "Worker.php&Family= " +  
   encodeURIComponent(JSON.stringify(Family)), true);
xhttp.send();

我发现您在 GET 请求中使用 

&
而不是 
?
。
如果我查看 w3schools 上的示例代码，它会向我展示一些不同的东西：

xhttp.open("POST", "ajax_test.asp", true);
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhttp.send("fname=Henry&lname=Ford");

尝试更改 JavaScript 代码以通过 POST 而不是 GET 发送数据。

0
投票

我试图看看我错过的事情，并在 $_POST 上添加了一些转换（以防万一，你知道）成为一个实际的数组，你猜怎么着。它就像一个魅力。这些是我真正讨厌 php 的地方，但我能做到。

所以，PHP 端的代码是这样的......

$Family =  (Array)json_decode( $_POST['Family']);

并且它不再抱怨为每个传递不正确的参数。实际上，它似乎也将数组的内部强制转换为父数组，因为每个内部的嵌套都按预期工作。

嗯，我对我在这件事上浪费的时间感到有点羞愧，但我感谢你们所有人的帮助，我非常感激，实际上正是你们的回答让我成功了这件事，（并通过$_POST获取数据发送)。

最新问题
© www.soinside.com 2019 - 2024. All rights reserved.