将可变大小的表格获取到javascript和PHP（AJAX）

Question

背景-
我有一个包含一堆按钮的网页（想想POS系统）。我希望用户能够编辑按钮的名称（用于按特定顺序放置它们）和按钮的文本，其中包含项目和成本两部分。目前，我可以通过将数据从一个PHP页面（完成编辑）传递到另一个PHP页面（将其写回到数据库）来工作，但是我想使用更多的AJAX方法并将其传递给js。保存编辑时更新功能。由于按钮的数量非常多，我不知道要读入脚本的确切按钮数量。目前我有这样的事情…

echo "<td><input type='text' name='btn[]' size='5' value='" . $row['button'] . "'/></td>";
echo "<td><input type='text' name='itm[]' size='5' value='" . $row['item'] . "'/></td>";
echo "<td><input type='text' name='prc[]' size='5' value='" . $row['price'] . "'/></td>";

发送到我有的PHP页面…

$buttonArray = $_POST['btn'];
$itemArray = $_POST['itm'];
$priceArray = $_POST['prc'];

$numberofItems = count($itemArray);

for ($i=0; $i<$numberofItems; $i++)
{
$sql = "UPDATE concessions SET button = '".$buttonArray[$i]."', item = '".$itemArray[$i]."', price = '".$priceArray[$i]."'";
mysql_query($sql);
}

我想在js中做类似的事情，查看document.form.elements，但无法弄清楚如何以某种形式发送（例如and数组），我可以使用for循环进行遍历。任何建议都欢迎。

Answer 1

有一个非常简单的方法：使用此简单的javascript函数（确保已加载最近的jquery）

$.fn.serializeObject = function()
{
    var o = {};
    var a = this.serializeArray();
    $.each(a, function() {
        if (o[this.name] !== undefined) {
            if (!o[this.name].push) {
                o[this.name] = [o[this.name]];
            }
            o[this.name].push(this.value || '');
        } else {
            o[this.name] = this.value || '';
        }
    });
    return o;
};

此函数将按正确的顺序序列化表单元素，并输出一个javascript对象。您需要将其与ajax一起使用，以解析您的值：

var objects = $("#ID_OF_YOUR_FORM").serializeObject();

$.ajax({
   url: "your_ajax_file_location.php",
   type: "POST",
   data: ({
       objects:objects,
       otherdata:otherdata
     }),
   success: function(msg){
        /* do whatever here */
    }
 });

Ajax将神奇地做到这一点，并自动将该对象转换为php数组并将其发布到php …尝试以下操作：

echo "<pre>".$_POST['objects']."</pre>";

php数组应如下所示：

{
    btn= array(
               "your btn1 info",
               "your btn2 info",
               "your btn3 info"
               );

    itm= array(
               "your itm1 info",
               "your itm2 info",
               "your itm3 info"
               );

    prc= array(
               "your prc1 info",
               "your prc2 info",
               "your prc3 info"
               );

}

通过这种类型的数组，很容易在php中操作以更新数据库