Question

我正在尝试编写一个脚本，在单个页面上提交所有单独的表单。我首先计算表单的数量，然后使用该计数我遍历每个表单并提交它。

在PHP页面上，每个表单都是这样编写的：

<form name="order_driver_'.$j.'" class="order_container" id="save_'.$j.'"method="post" action="../scripts/order_driver_save.php">

然后我使用JavaScript计算每一个并提交它们：

    function count_form(){

    //Count the amount of outputs
    var count = $(".order_container").size();

    //Run loop for reults
    for(count=count;count>0;count--){

        //var save='order_driver_'+count;

        document.order_driver+count.submit();

    }
}

我遇到的问题是提交部分：

document.order_driver_ + count.submit();

我无法将var count连接到.order_driver_。

我想知道如何做到这一点，所以我可以指定要在循环中提交的每个表单名称。

Answer 1

如果您希望它们全部提交，您将不得不通过AJAX提交它们，因为只要提交了一个，浏览器就会跟随请求并刷新页面。因此，即使你连接它，它也只会提交第一个。

<强>更新

虽然我知道我可能会因为建议你使用jquery而受到轰炸，但我认为在这种情况下，它会大大简化你需要做的事情。

如果您使用jQuery，此代码将实现您的目标。

// #submit-click being whatever you want to initiate the mass form submit
$('#submit-button').click(function() {
    $('form').submit();
});

//form submit event handler
$('form').submit(function() {
    //get the form and serialize it's data
    var form = $(this);
    var data = form.serialize();

    //submit via AJAX
    $.post(form.attr('action'), data);

    //prevent the default action of submit
    return false;
});

请注意，您不会收到任何已提交的确认信息。

Answer 2

注意：您必须将呼叫彼此分开，否则页面将移动到提交的目标。要么Ajax调用，要么将目标放在新窗口中。

更改它以获取元素并提交该元素：

function count_form(){

//Count the amount of outputs
var count = $(".order_container").size();

//Run loop for reults
for(count=count;count>0;count--){

    //var save='order_driver_'+count;

    document.getElementById("order_driver_" + count).submit();



}
}

Javascript动态表单提交

2 个答案: