Question

我正在尝试提交一个动态添加了元素的表单，但是当我在控制器中收到它时，formCollection为空：

我的html标记如下所示：

…
<form id="submitCart" name="submitCart" action="submitCart" method="POST" enctype="multipart/form-data">
            <button class="major" value="Done, Proceed to checkout!" id="formSubmitCart" type="submit">Done, Proceed to checkout!</button>
    </div>

    <div class="infosheet">
        <table>
            <thead>
                <tr>
                    <th style="width: 60px">Qty.</th>
                    <th style="width: 240px">Product Name</th>
                    <th style="width: 60px">Price</th>
                </tr>
            </thead>

            <tbody id="cardList">
            </tbody>
            </form>

        </table>
…

在jQuery中将元素添加到其中：

$('#addtocart').click(function () {
    var itmCnt = parseInt($('#itemCnt').val());
    itmCnt = itmCnt + 1;

    $('#itemCnt').val(itmCnt);
    //var htmlStr = "<tr><td style='width: 60px'><input type='text' name='qntty" + itmCnt + "'  disabled=disabled value='" + $('#qntty').val() + "' style='width: 60px'/></td><td style='width: 240px'><input type='text' name='prdNme" + itmCnt + "'  disabled=disabled value='" + $('#prdNme').val() + "'  style='width: 200px'/></td><td style='width: 60px'><input type='text' name='ttlprce" + itmCnt + "' disabled=disabled value='" + $('#ttlPrce').val() + "'  style='width: 60px'/></td></tr>";

    var htmlStr = "<tr><td style='width: 60px'><input type='text' name='qntty" + itmCnt + "'  readonly=readonly value='" + $('#qntty').val() + "' style='width: 60px'/></td><td style='width: 240px'><input type='text' name='prdNme" + itmCnt + "'  readonly=readonly value='" + $('#prdNme').val() + "'  style='width: 200px'/></td><td style='width: 60px'><input type='text' name='ttlprce" + itmCnt + "' readonly=readonly value='" + $('#ttlPrce').val() + "'  style='width: 60px'/></td></tr>";

    ...
    ...
    $('#cardList').prepend(htmlStr);

});

添加几次后，此标记看起来像这样（来自inspect）

<tbody id="cardList">
<tr>
    <td style="width: 60px">
        <input type="text" name="qntty4" value="53" style="width: 60px">
    </td>
    <td style="width: 240px">
        <input type="text" name="prdNme4" value="Rice" style="width: 200px">
    </td>
    <td style="width: 60px">
        <input type="text" name="ttlprce4" value="2480.4" style="width: 60px">
    </td>
</tr>
<tr>
    <td style="width: 60px">
        <input type="text" name="qntty3" value="53" style="width: 60px">
    </td>
    <td style="width: 240px">
        <input type="text" name="prdNme3" value="Rice" style="width: 200px">
    </td>
    <td style="width: 60px">
        <input type="text" name="ttlprce3" value="2480.4" style="width: 60px">
    </td>
</tr>
</tbody>

然后我通过这个提交它：

$('#submitCart').on('submit', function (e) {
        console.log($(this).serialize()); // still empty
    $.post('submitCart', $(this).serialize(), function (result) {
        $('#msg').val(result);
        console.log(result);
        console.log($(this).serialize()); //Empty Nothing here..
    });
    e.preventDefault();
});

我有这样的路线：

routes.MapRoute(name: "submitCart", url: "submitCart", defaults: new { controller = "Inventory", action = "SubmitCart" });

但在我的控制器中，当我尝试从formCollection读取时，没有任何内容

    public bool SubmitCart(FormCollection submitCart)
    {
        var b = submitCart.Count;

        foreach (var key in submitCart.AllKeys)
        {
            var value = submitCart[key];
            // etc.
        }

        var a = submitCart;
        return true;

    }

当动作被击中时路线没问题，我通过设置断点来检查它。任何人都可以请指导我，为什么我不能收到我的表格集。三江源

Answer 1

FormCollection为空，因为您在添加元素后禁用元素，并且请求中未提交已禁用的元素。

您可以通过css结合readonly属性来实现禁用的外观。

Twitter Boostrap是这样的：

input[disabled],
select[disabled],
textarea[disabled],
input[readonly],
select[readonly],
textarea[readonly] {
  cursor: not-allowed;
  background-color: #eeeeee;
}

您可以使用类似的方法。

附录：以下是有关disabled元素的其他问题的链接：Disabled form inputs do not appear in the request

提交后，formCollection在控制器中为空

1 个答案: