Question

我有一个表单，我需要附加两个不在表单范围内的项目。我正在使用jQuery来做它。

我的代码正在运行，但是，第二次提交表单时，我得到的是我第一次选择的值。

这是我的代码：

<script type="text/javascript">
    $(document).ready(function () {
        $("#btnUpdate").click(function (event) {

            var items = [];

            $('#params :selected').each(function (i, selected) {
                items[i] = $(selected).text();
                $(selected).prop("selected", false)
            });

            //So far, so good. My variable 'items' changes the second time.

            //The problem is here:

            for (var i = 0; i < items.length; i++) {

                var submitVal = items[i];
                $('#myForm').append("<input type='hidden' name='param" + i + "' value='" + submitVal + "' />");
            }

            return true;
        });
    });

</script>

我想我第二次追加第三和第四个参数，这意味着我从第一次开始param0, param1 - 再次param0, param1 - 从第二次开始。

第三次我追加第五和第六次等等。

在服务器端，我正在使用ASP.NET MVC。

public ActionResult Method(string param0 = "", string param1 = "")

我尝试使用方法.submit，但我没有成功，这就是我使用.click方法的原因。

现在我正在尝试附加两个参数，提交表单，然后删除它们。

有关如何进行的任何想法？或者任何更好的解决方案的想法？

Answer 1

假设您的表单中没有任何其他隐藏的输入，您可以尝试在添加新项目之前将其全部删除：

$('#myForm').find('input[type=hidden]').remove(); //remove all hidden elements

for (var i = 0; i < items.length; i++) {
    var submitVal = items[i];
    $('#myForm').append("<input type='hidden' name='param" + i + "' value='" + submitVal + "' />");
}

如果您有其他隐藏元素，请使用相同的类标记这些动态元素，并使用它来选择要删除的元素：

$('#myForm').find('input[type=hidden].dynamic').remove(); //remove all hidden elements tagged with dynamic class

for (var i = 0; i < items.length; i++) {
    var submitVal = items[i];
    $('#myForm').append("<input class='dynamic' type='hidden' name='param" + i + "' value='" + submitVal + "' />");
}

Answer 2

我会花更多的精力来处理提交事件，因为用户不一定需要点击按钮来提交表单。

但无论如何，我会给动态添加的输入一个特殊的类，并在页面加载时使用它来删除它们：

$('#myForm').append("<input type='hidden' class='dynamically-added' name='param" + i + "' value='" + submitVal + "' />");

...

$(document).ready(function () {
    $('input.dynamically-added').remove();
});

如何在使用jQuery动态附加提交参数后删除它们？

2 个答案: