Javascript動態表單提交

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提交它們，因為只要提交了一個，瀏覽器就會跟隨請求並刷新頁面。 所以，即使你連接它，它也只會提交第一個。

UPDATE

雖然我知道我可能會因為建議你使用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();



}
}