动态输入字段不与表单一起发布答案

【问题标题】：Dynamic Input Fields don't POST with Form动态输入字段不与表单一起发布
【发布时间】：2013-09-24 01:27:38
【问题描述】：

我目前有一个 Javascript 函数，它可以根据需要多次克隆我的表单（选择框）的一部分，让最终用户可以根据需要添加任意数量的字段。一切正常，除了只有硬编码的 HTML 是通过 POST 与我的表单一起发送的，其余的不包括在内。为什么会这样？如何解决？

Javascript：

$(function()
{
    var template = $('#inventoryItems .inventory:first').clone(),
        inventoryCount = 0;

    var addInventory = function()
    {
        inventoryCount++;
        var inventory = template.clone().find(':input').each(function()
        {
            var newLabel = "invItem{" + inventoryCount + "]";
            $(this).prev().attr('id', newLabel);
            $(this).prev().attr('name', newLabel);
        }).end()
        .attr('id', 'inv' + inventoryCount)
        .appendTo('#inventoryItems > fieldset');
    };

    $('.btnAddInventory').click(addInventory);
});

HTML

                        <fieldset style="width:62%; float:left; margin-left: 19%;">

                            <div id="inv1" class="inventory" style="margin-bottom:5px;">
                                <select name="invItem[0]" id="invItem[0]" style="width:92%;">

                                    <?php
                                        getInventoryOptions($dp_conn, "", $datacenter);
                                    ?>
                                </select>

                                <input class="btnRemoveInventory" type="button" style="background: url(images/icn_trash.png) no-repeat; cursor:pointer; border: none;">
                            </div>

                        </fieldset><div class="clear"></div>

                        <!-- Add Inventory Button -->
                        <div style="width:62%; margin:0; padding:0; float: right; margin-right: 19%">
                            <input class="btnAddInventory" type="button" value="Add Item" style="float: right;">
                        </div><div class="clear"></div>

                    </div>

【问题讨论】：

标签： javascript html forms post dynamic-forms

【解决方案1】：

我猜是这样的：

var newLabel = "invItem{" + inventoryCount + "]";
//---------------------^

应该是

var newLabel = "invItem[" + inventoryCount + "]";

【讨论】：

谢谢！温特回答得快一点，所以我会接受他的，但感谢您的回复:)
@BrettPowell 公平地说，Dr.Molle 的回答比我早 18 秒。
我一定是看错时间了。不过谢谢你，我会继续接受这个。

【解决方案2】：

当您更新输入的 id 和名称时，您将用 invItem{x] 而不是 invItem[x] 替换它。

【讨论】：

哇，这么简单，却造成这么多问题。感谢您指出这一点！
@BrettPowell 它越简单，有时就越难找到，无需额外的眼睛注视。我经常发现自己盯着代码想知道为什么它不起作用，只是为了意识到我正在使用其他完全有效的 PHP 语法/函数，但是在 Javascript 中。