一个成功的AJAX序列化表单帖子从echo php变量

Question

- 代码已编辑为现在完全正常运行 -

我想从输入中获取一些双打和 ints 并将它们发布到php最终更新mysql行。请告诉我们是否有更好的方法。 （我想做多维数组）

我一直在网上搜索2天，并且只是在尝试做这项工作的同时思考：“那些堆叠花可能会在2分钟内解决这个问题”：C

- 感谢杰夫的所有帮助 - 我是否需要删除我的“问题”

“HTML部分”：

<?php

echo "<form id='shoplistform'>";              
echo "<table id='tablecode'> "
     . "<tr> "
         . "<th id='RecTh'>Rec"
             . "<button class='myButton' type='submit' value='Send'>Remember</button>"
         . "</th>"                    
         . "<th id='Ingredients' >Ingredients</th>"
         . "<th id='Amount'>Amount</th>"
         . "<th id='Lavest'>Lavest Pris</th>"
     . "</tr>";    

     $stmt = $pdo->prepare("SELECT * FROM lists WHERE `email` = :email");
     $stmt->execute(['email' => $email]); 

     $row = $stmt->fetchAll();

     if (count($row) > 0) {

         // output data of each row
         for($i = 0; $i < count($row); $i++ ) {
             $listamount = $row[$i]["amount"];
             $listpris = $row[$i]["pris"];    

             echo "<tr class='tests' ><td>name: " . $row[$i]["name"]. "</td>"
                 . "<td> vare: " . $row[$i]["food"]. "</td>"
                 . "<td><input type='number' class='listamount' id='\"" . $row[$i]['id'] . "\"' name='bar[]' value='$listamount' > </input></td>"
                 . "<td><input style='display:none' type='number' class='listpris' value='$listpris' ></input>" . $row[$i]["pris"]. " kr " . $row[$i]['id'] 
             . "</td></tr>";
         }
     } 

     else {
         echo "0 list";
     }                                      

     echo "</table></form>";                          
 ?>

jquery / ajax （来自Stackflow: origin of code below）

$(document).ready(function(){      

    // Variable to hold request
    var request;

    // Bind to the submit event of our form
    $("#shoplistform").submit(function(event){

        // Prevent default posting of form - put here to work in case of errors
        event.preventDefault();

        // Abort any pending request
        if (request) {
            request.abort();
        }

        // setup some local variables
        var $form = $(this);

        // Let's select and cache all the fields
        var $inputs = $form.find("input, button");

        // Serialize the data in the form
        var serializedData = $form.serialize();
        alert(serializedData);

        // Let's disable the inputs for the duration of the Ajax request.
        // Note: we disable elements AFTER the form data has been serialized.
        // Disabled form elements will not be serialized.
        $inputs.prop("disabled", true);

        // Fire off the request to /form.php
        request = $.ajax({
            url: "shoplistupdate.php",
            type: "post",
            data: serializedData,
        });

        // Callback handler that will be called on success
        request.done(function (response, textStatus, jqXHR){

            // Log a message to the console
            //console.log("Hooray, it worked! >" + response + " >" + textStatus + " >" + jqXHR);
           $("#txtHints").html(response);

        });

        // Callback handler that will be called on failure
        request.fail(function (jqXHR, textStatus, errorThrown){

            // Log the error to the console
            console.error(
                "The following error occurred: "+
                textStatus, errorThrown
            );
        });

        // Callback handler that will be called regardless
        // if the request failed or succeeded
        request.always(function () {
            // Reenable the inputs
            $inputs.prop("disabled", false);
        });

    });
});

PHP

$bar = isset($_POST['bar']) ? $_POST['bar'] : null;

print_r($bar);
echo "<br><br>";
var_dump($bar);

jquery部分中的alert（serializedData）说：“bar =＆gt; 3＆amp; bar =＆gt; 2＆amp; bar =＆gt; 1”。正确的值，但......

PHP返回：

Array ( [0] => 3 [1] => 2 [2] => 1 ) 

array(3) { [0]=> string(1) "3" [1]=> string(1) "2" [2]=> string(1) "1" }